트위터카운터(Twittercounter)를 자신의 트위터로 바로 연결하기

트위터는 간단하게 친구를 맺고 서로의 블로그나 사이트의 글들을 엮을 수 있고 친구도 만들 수 있는 소셜 네트워크 서비스입니다.

사용하다보면 트위터카운터(Twittercounter)를 블로그에 달아놓게 되는데요. 보통 한RSS 나 피드버너 카운터 경우는 누르면 RSS 주소와 연결되게 되어있죠. 트위터의 카운터는 누르면 트위터카운터 페이지와 연결되게 되어있습니다.


실제로 눌러보면 카운터가 뜰것입니다.

트위터카운터를 누르면 트위터카운터페이지가 뜨는데 이렇게 뜨지 않고 자신의 트위터가 뜨도록 바꿔보도록 하겠습니다. 먼저 스크립트를 살펴보겠습니다.

자신의 트위터카운터를 누른뒤 트위터카운터를 나타내주는 배너를 누르면 모양별로 쓸 수 있는 스크립트 내용이 나옵니다.

첫번째 코드를 먼저 살펴보겠습니다.

<script type="text/javascript" language="javascript" src="http://twittercounter.com/embed/?username=cdmanii">
</script>

스크립트는 간단하게 되어있습니다. 하지만 누르면 피드카운터페이지로 자동으로 연결 되게 되어있지요.
내부에 경로를 다시 코드를 열어보면,

<!--
drawTREmbed( '<div id="TwitterCounter"><a href="http://twittercounter.com/cdmanii?from=button" title="TwitterCounter for @cdmanii" target="_new"><img src="http://209.20.76.117/counter/?username=cdmanii&style=" width="88" height="26" style="border:none;" alt="TwitterCounter for @cdmanii" /></a></div>' );

function drawTREmbed(s){
    document.write(s);
}
// -->

이렇게 되어있군요. 내부에는 <div> 를 다시 뿌리도록 되어있습니다. 원하는 경로로 대려가려면 내부의스크립트의 주소를 변경해야하는데 그건 좀 아닌듯하고, 어짜피 내부의 코드를 알았으니 그냥 써버리면 됩니다.

지금 하려는것은 트위터카운터를 누르면 자신의 트위터를 뛰우도록 하는것입니다. 임의로 따라오라고 Follow 등의 메시지를 안남겨도
카운터를 누르고도 바로 볼 수 있겠죠. 당연히 기존의 스크립트도 카운터를 누른뒤 그사람의 트위터로 이동할 수 는 있습니다. 하지만
언제나 이야기하듯 마우스 1번클릭과 2번클릭의 차이는 큽니다.

<!-- 트위터카운터를 누르면 자신의 트위터로 바로 이동하게 변경, 노란색부분을 자신의 트위터 아이디로 변경 -->
<a href="http://www.go2web20.net/twitterfollowbadge/redir.htm?트위터아이디" title="TwitterCounter for @트위터아이디" target="follow"><img src="http://209.20.76.117/counter/?username=트위터아이디&style=" width="88" height="26" style="border:none;" alt="TwitterCounter for @트위터아이디" /></a>

코드는 그냥 내부에 출력되는 부분을 그냥 가져왔을 뿐입니다. 바꿔야하는 부분은 자신의 트위터카운터의 그림(카운터) 와 자신의 트위터주소입니다.

간단히 설명하자면 노란색으로 나타낸 트위터아이디 부분을 자신의 트위터아이디로 바꿔놓으면 됩니다. 해당코드는 적당한곳에 넣습니다.



지금 이 피드카운터는 적용이 된 모습입니다. 누르면 제 트위터로 바로 연결되게 됩니다. 이제 제 트위터 카운터를 누르세요! 라고 말할 수 있겠죠. 1번클릭으로 트위터가 바로 뜰테니까요!