티스토리, 카테고리 New icon 수정하는 방법



오늘 블로그에 들어와서 보니 카테고리의 New icon의 모습이  ->  바뀌어 있었다.

이게 뭔가 싶은게 갑자기 짜증이 확~  지금 사용하는 탕비수다 스킨과 어울리지 않는 모습의 아이콘에 오기가 발동, 한번 바꿔본다.



CSS 추가


@-webkit-keyframes blink{ 0% {opacity:0;} 100% {opacity:1;} }

@-moz-keyframes blink { 0% {opacity:0;} 100% {opacity:1;} }

@keyframes blink { 0% {opacity:0;} 100% {opacity:1;} }


.blinking { -webkit-animation:blink 1.5s ease-in-out infinite alternate; -moz-animation:blink 1.5s ease-in-out infinite alternate; animation:blink 1.5s ease-in-out infinite alternate; border-radius: 50%; box-shadow: 1px 5px 10px rgba(187,187,187,0.5); }


/*** 

#bbbbbb Color Hex  - rgba(187,187,187) 

border-radius: 50%;   // New icon을 동그랗게 만든다.

box-shadow: 1px 5px 10px rgba(187,187,187,0.5);   // New icon 밑에 그림자를 준다

***/


아니면, 아이콘만 바꾸는 방법은


<script>

  $('img[alt="N"]').each(function(){

  $(this).replaceWith('새글 있지롱'); /* 이미지경로로 지정해도 됨 */

  });

</script>


HTML 적용하는 방법


<span class="blinking"> 반짝이게 하고 싶은 이미지나 텍스트 </span>



변경된 카테고리의 New icon이 탕비수다 스킨과는 어울리지 않아 맘에 들지는 않지만 이런 방법으로 수정해 본다. 


   참고    

HTML 태그 글자나 이미지에 반짝이는 효과주기 - http://pikabu.tistory.com/77 , 

CSS3를 사용한 이미지 효과, 스타일 - https://nanati.me/css3-image-effects/





추가, 아래처럼 하는 방법도 있지만 이 경우는 텍스트에 적용하는게 보기에 좋아 PASS~


더보기


저작자 표시 비영리 변경 금지
신고

묘한오빠

남자의 호칭 중에 "오빠"처럼 묘한 것은 없다

    이미지 맵

    묘한오빠/블로그가 변하는 이유 다른 글

    댓글 : 10

      • SONYLOVE님 알려주신 방법.

        개편 후 티스토리 전체 카테고리명 변경하기
        http://sonylove.tistory.com/2416

        스토리의 개편으로 전체 카테고리명의 변경이 불가능해졌다.
        예전에는 마음대로 변경할 수 있었는데 이제는 관리자에서는 변경할 수 없다. 그래서인지 블로거들 중 이에 대한 불만들이 많은듯 하다.
        사실 나는 예전에 이미 MY STORY 라는 명칭으로 바꿔놓아서 카테고리명 변경이 되지 않는다고 해서 불만은 없다.
        그리고 광고 블로거들이 이곳에 오는걸 별로 좋아하지 않아서 블로그 꾸미기 관련 글은 가능하면 더이상 안쓰려고 했는데 그래도 혹시 필요한 사람이 있을꺼 같아서 글을 써본다.
        티스토리의 스킨을 선택하여 설치하게 되면 기본 전체 카테고리명은 현재 '분류 전체보기'로 표시된다. (아래 그림 참조)
        이 명칭을 바꾸는 방법은 아주 간단하다. 티스토리에 요청하지 않아도 마음대로 바꿀 수 있다.

        *** 중략 ***


        전체 카테고리명 변경

        <script>
        $('.link_tit').each(function(){ var _this = $(this);
        if( _this.text() ){ var _searchCntStr = '' + _this.text().replace('분류', '나의').replace('전체보기', '예쁜글') ; _this.text(_searchCntStr); }});
        </script>


        혹은,

        <script>
        $('.link_tit').each(function(){ var _this = $(this);
        if( _this.text() ){ var _searchCntStr = '' + _this.text().replace('분류 전체보기', '나의 예쁜글'); _this.text(_searchCntStr); }});
        </script>

      • New icon도 바꾸는 방법이 아시면 좋겠는데 ...,

      • 일단 새글 아이콘 변경하는 방법을 포스팅 해보았어요.
        도움이 되시길...

      • 신고 버튼 꾸미기 방법 - http://sonylove.tistory.com/1303
        새글 발행여부 아이콘 변경 - http://sonylove.tistory.com/2417

        <script>
        $('img[alt="N"]').each(function(){
        $(this).replaceWith('새글 있지롱');
        });
        </script>

        좋은 정보 알려주셔서 감사합니다. ^^

        이런 스크립터는 어디서 배우세요. 잘 참고하겠습니다
        저는 여기저기 적용해보고 되면 하고 안되는 말고식의 야매삘이라서 ... ㅋㅋ, 정말 감사합니다.

      • SONYLOVE님 덕분에 새글 아이콘 변경 잘되었습니다.
        감사합니다. ^^

        전체 카테고리 이름은 이 스킨에서는 적용이 안되는거보니 ..., 뭔가 다른문제가 있는듯하네요 ^^

      • 이 스킨의 어느 특정 스크립트에서 동일한 명칭을 사용해서 충돌이 있을수도 있고요. 다른 스킨은 되는 걸 보면 스크립트 자체에 문제가 있는건 아닌거 같아요.

      • 저도 그렇게 생각합니다 ^^
        원래는 http://ooppa.tistory.com/category/ 경로에서 타이틀이 최상단으로 지정해놓은 OOPPA.TISTORY.COM으로 이름이 나와서 그걸 수정할려고 했는데 그건 안되더라구요.

        신경써주셔서 감사합니다.

      • 그리고 저도 묘한오빠님과 비슷한 야매라는..

    *

    *

    /~ 이미지 링크 ~/

    이전 글

    다음 글