블로거팁닷컴


블로그에 트위터 뱃지를 달아놓는 방법

블로그를 구경하다 보면 Follow Me 문구가 새겨진 트위터 뱃지가 보이곤 합니다. 바로 트위터 팔로우 버튼이 그 주인공인데요. 방문자가 트위터 버튼을 클릭하면 해당 블로그의 운영자가 운영하는 트위터로 이동하게 됩니다. 트위터 홍보도 되고 리본 형식으로 깔끔하게 달아놓을수 있어서 페이지가 버벅거린다거나 하는 문제도 없어요. 일석이조입니다. 게다가 색상도 자신의 블로그 디자인에 맞게 변경할수 있답니다.


☞ 제 블로그를 보시면 오른쪽에 Follow me라고 적힌 트위터 유혹(?) 버튼이 있고 그 위에 새가 앉아 있습니다. 새의 자태, 아름다운가요? 트위터 뱃지를 설치할수 있도록 소스를 제공하는 사이트로 이동합니다. http://www.go2web20.net/twitterfollowbadge/
트위터

☞ 아래의 화면이 나오게 되는데요. 여기서부터 잘 따라하세요. 1번 항목은 자신의 트위터 주소중 뒷부분을 적어주는 곳입니다. 제 트위터 주소를 예로 들면 http://twitter.com/FollowZet 에서 FollowZet만 적어주면 되겠습니다. 2번에서는 뱃지에 들어가는 문구를 선택하면 됩니다. 3번에서는 뱃지의 색상을 변경할수 있어요. 동그랗게 생긴 색상표를 이용해서 마음대로 색상을 변경할수 있답니다. 4번 항목은 왼쪽에 달것인지 오른쪽에 달것인지를 선택해 주는 곳입니다. 5번에서는 위에서 부터 거리를 얼마나 띄울것인지를 정해주면 되겠어요. 다 되셨으면 반드시 6번을 눌러주셔야 합니다. 그래야 변경된 사항들이 코드에 반영 되거든요. 따끈따끈한 코드를 모두 선택한 후 복사합니다. (Ctrl+C키)
트위터

☞ 블로그 관리자 화면으로 접속합니다. 스킨이라고 적혀진 곳에 마우스를 올려놓으면 HTML/CSS 편집이라는 메뉴가 보여요. 해당 메뉴를 클릭하면 아래와 같이 스킨 편집 화면이 보입니다. skin.html 부분을 스크롤해서 가장 아래쪽으로 내려오면 </body>가 보입니다. 그 앞에다 전 단계에서 복사해 놓은 소스를 붙여 넣으시면 됩니다. Ctrl+V키를 누르시면 되겠죠? 트위터 뱃지 예쁘게 달아보세요. :)
트위터

신고


댓글을 달아 주세요

  1. 이전 댓글 더보기
  2. BlogIcon ideakeeper

    좋은 정보 잘 보고가요~ㅋ
    바로 적용 시켰답니다.ㅋ

     ×  +
  3. BlogIcon 신난제이유

    제가 찾아 다니던 그 정보!! 역시 제트님!
    적용 잘 시켜 볼께요 :-)

     ×  +
  4. BlogIcon 도로시

    통합LG텔레콤의 블로그 '도로시의 OZ LAB'을 운영하고 있는 도로시입니다~
    너무 좋은 Tip이라 당장 적용시켰답니다 ㅎㅎ
    감사해요 :-)

     ×  +
  5. BlogIcon 마루.

    아~~감사합니다..~~ 저도 바로 적용...

     ×  +
  6. duul

    블로그를 처음 사용하는 블로거 입니다
    제트님의 블로그에서 영감을 많이 받고 있습니다
    오늘 정보도 정말 감사합니다~^^

     ×  +
  7. duul

    아직 댓글쓰는 것도 많이 미숙합니다 ㅋㅋ

     ×  +
  8. BlogIcon duul

    아하 왜 저는 이름에 링크가 없나 했더니 웹사이트 입력을 안했군요 ㅡㅡ

     ×  +
  9. BlogIcon 토토스카

    매번 제트님 덕분에 유용한 정보를 많이 얻어가네요..^^;;;;;;;;;

     ×  +
  10. BlogIcon 소중한시간

    어이쿠! 굉장히 유용한 정보네요! 감사합니다 ^^

     ×  +
  11. BlogIcon 서윤파파

    블로그에 트위터 버튼다는 방법을 연구하고 있었는데....
    굉장~~~~~히~~~~ 고맙습니다.

     ×  +
  12. 브라이언송

    ZET님 감사. 설치 완료 했슴다.^^

     ×  +
  13. BlogIcon 꼬깃꼬깃

    와 감사합니다!
    덕분에 제 블로그에도 상큼하게 설치 완료했어요! ^^

     ×  +
  14. BlogIcon 대경중국연구소

    제트님 잘보고갑니다 ^^

     ×  +
  15. BlogIcon 한성민

    잘 보고 갑니다....^^
    덕분에 한방에 달았습니다...~~~

     ×  +
  16. BlogIcon 박영인

    제블로그에는 스킨 메뉴에 님과 같은 서브 메뉴가 없어요.
    네이버 블로그인데....ㅠㅠ

     ×  +
  17. BlogIcon sseul-p

    와아아아
    지금 완전 30분도 넘게 헤매고 있었는데 너무 감사해요!!
    한방에 날렸어요~~!! ㅎㅎㅎㅎ

     ×  +
  18. BlogIcon 하얀돌(정정도)

    좋은정보 감사합니다. 바로 적용했습니다.
    그런데 튀위터 표시가 없어요

     ×  +
  19. BlogIcon 짱군

    ^^ 감사합니다~~~
    잘보고~~ 바로 적용해 봅니다..^^

     ×  +
  20. 포이에마

    네이버블로그에는 안되나봐요

     ×  +
  21. BlogIcon sosoboy_ho

    지금 바로 적용했어요~^^ 정말 좋은 정보 감사합니다.

     ×  +