[블로그와 SNS연결 2] 블로그에 움직이는 트튀터 팔로우 배지 달기

블로그를 운영하는 사람은 누구나 트위터나 페이스북과 같은 소셜네트워크서비스(SNS: Social Network Service) 사이트와 연동하고자 할 것이다. 그러나 HTML나 CSS등 홈페이지 관련 컴퓨터 언어를 이해하지 못하는 초보자는 시행 착오를 많이 겪게 된다. 본인도 2011년 1월 SNS에 대한 호기심과 함께 만들기 시작한 블로그에  달려는 시도를 시작했지만 쉽지 않았다. 틈틈히 주말에 여려 방법이 나와 있는 글을 읽고 시도 해 보았지만 시행 착오를 많이 격어야 했다. 각 블로그에는 친절하게 방법들을 잘 설명하고 있지만, 초보자가 바로 따라가기에는 쉽지 않은 면이 있었다.

여러번의 시행착오 끝에 본인이 Tistory에 개설한 블로그에 트위터, 페이스북 페이지, NetworkedBlog, 마이픽업을 연결하여 글을 상호 공유할 수 있는 방법을 터득했다. 이렇게 연결하는데 적지 않은 시간과 노력이 들어, 초보자 입장에서 그방법을 소셜 친구들과 공유하고자 한다.

트위터 팔로우 배지 모습 및 기능

 
제 우리나라도 트위터 사용이 보편화 되어 가는 것 같다. 블로거라면 자신의 블로그를 방문하는 사람이 트위터에서도 팔로우 하기를 원할 것이다.  이럴 때 사용하는 것이 트위터 팔로우 배지(Twitter Follow Badge)이다.

트위터 팔로우 배지를 자신의 홈페이지나 블로그에 연결하려면 먼저 배지를 제작해야 하나, 초보자가 이러한 배지를 만드는 것은 쉽지 않다. 물론 HTML/CSS나 Java 컴퓨터 언어에 익숙한 파워 블로거나 고급 홈페이지 운영자는 스스로 만들 수도 있을 것이다.


그러나 초보자는 트위터 팔로우 배지 스크립을 제공해주는 무료 사이트를 이용하는 것이 훨씬 편리하다. 
이러한 배지를 제공해주는 싸이트는 많지만, 비교적 간단한  http://www.go2web20.net/에서 제공하는 배지를 티스토리 블로그에 연결하는 방법을 소개 하고자 한다.

 

배지제공 사이트로 가기

 

트위터 팔로우 배지 스크립을 얻기 위하여 먼저 http://www.go2web20.net/twitterFollowBadge/사이트를 클릭한다.

(1) Twitter account 적는다

(2) Lebel: 에 표시되길 원하는 배지이름을 선택한다
    : Follow us, Follow me, Follow, My twitter 중에 하나를 선택

(3) Color: 난에서 원하는 색상을 선택한다.

(4) Side: 배지가 표시될 위치를 선택한다(left 혹은 Right)

(5) From top: 배지가 달릴 위치를 선택한다. 숫자가 커질수록 페이지의 아래 쪽에 배지가 달린다.



(6) Update Code 버튼을 누르면 위에서 선택한 옵션에 따라 배지를 자신의 홈페이지나 블로그에 달 수 있는 스크립이 다음과 같이 나타난다. 스크립 있는 박스에서 Ctrl-C를 눌러 클립보드에 복사해 놓는다, 이 배지를 이용하기 위해서는 인터넷 익스플로러 6.0 이상이어야 한다.

 

다음 단계로는 위의 트위터 팔로우 배지를 블로그 스크립의 원하는 위치에 복사하면 끝난다.

티스토리 블로그에 복사한 배지 스크립 삽입하기

(1) HTML/CSS편집

먼저 티스트로리의 관리자메뉴로 들어가 스킨→HTML/CSS편집 메뉴로 들어간다. 이 메뉴로 들어가면 skim.html과 style.css 스크립 에디터가 나타나게 된다. skim.html 스크립 에디터의 </body> 구문 앞에 미리 복사해 둔 트위터 팔로우 배지를 붙여넣기 하면 된다.

(2) </body>구문 앞에 배지 삽입

 에디터에는 많은 스크립이 있기 때문에 정확한 붙여 넣기 해야 할 위치를 정확히 찾는 것이 쉽지 않다. 페이지를 스크롤 해서 찾을 수도 있겠지만 Ctrl-F를 눌러 검색창에 </body>를 입력하면 초보자도 쉽게 찾을 수 있다. 복사해서 붙여 넣기만 하면 멋진 트위터 팔로우 배지가 만들어 진다.