상세 컨텐츠

본문 제목

소셜버튼, 10분만에 뚝딱 설치하기

IT/블로그꾸미기

by 하얀잉크 2011. 3. 2. 02:08

본문



모처럼 휴일을 맞아 제 블로그에 약간의 변화를 주었습니다. 소셜미디어로 글을 보낼 수 있는 소셜버튼을 설치한 것인데 아주 쉽게 코드를 생성해서 HTML 형태로 삽입하면 됩니다. 초보자도 10분이면 쉽게 할 수 있을만큼 쉽습니다.


위 그림에 보이는 버튼들이 그것인데요. 사실 티스토리에서 트위터, 페이스북, 요즘, 미투데이 등 SNS로 글보내기 플러그인 서비스를 하고 있지만 제가 원하는 버튼만 골라 상단에 설치했습니다.

많은 분들이 이미 알고 있고 사용하고 있는 Add This 사이트에서 제공하는 버튼인데요. 너무 쉬워서인지 의외로 리뷰해주신 분들이 없어 정리할 겸 올려봅니다. (마지막 필살기 활용팁은 괜찮은 정보가 아닐까 자위해봅니다. ^^)


먼저 Add This 사이트에 접속합니다. http://www.addthis.com
무료로 제공되는 네 가지 버튼 버전 중에서 하나를 선택하고 레드박스의 Get Your Button을 클릭합니다. 전 세번째 박스형 버튼을 선택했습니다.


어디든 그렇듯 가입을 해야죠. 소셜로그인 기능이 되므로 오래걸리지 않습니다. 전 페이스북으로 소셜로그인을 했습니다.


이제 생성된 코드를 카피해가면 됩니다.

<코드값>
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4d6cf3487fada020">></script>
<!-- AddThis Button END -->

필살 활용Tip

그런데 위 코드로 생성된 것은 페이스북, 트위터, 마이스페이스, 그리고 프린터 기능입니다. 이 중에서 마이스페이스는 국내에서 잘 이용하지 않을뿐더러 저도 이용하지 않는 서비스입니다.
이왕이면 제 입맛에 맞는 서비스를 넣으면 좋겠죠? 그래서 수정한 것이 아래의 코드값입니다.

<수정한 코드값>
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_11"></a>
<a class="addthis_button_preferred_6"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4d6cf3487fada020">></script>
<!-- AddThis Button END -->

눈치 챈 분들도 계시겠지만 각 버튼의 값이 숫자로 매겨져 있습니다. 숫자를 변경하거나 추가하면 무려 333개의 서비스까지 글을 보낼 수가 있습니다.

저는 3번인 마이스페이스그를 6번 즐겨찾기로 바꾸고 11번 이메일링 서비스를 추가한 것이죠.

내 블로그에 설치하기

이제 자신의 블로그에 설치만 하면 됩니다. skin.html에 쉽게 삽입하면 되는데 전 제목과 구글 애드센스 사이에 설치했습니다. 하단에는 티스토리에서 제공하는 플러그인 버튼이 있으니 상단에 설치하는 것을 추천드립니다.


위치는 위 그림에서 보듯 애드센스가 끝나는 지점에 넣으시면 됩니다. 스킨에서 google_ad를 찾으셔도 되고 [# #_article_rep_desc_# #] 를 찾으셔도 됩니다. 단, 후자의 경우 구글 애드센스 밑으로 설치될 수도 있으니 주의하셔야 합니다.

관련글 더보기

댓글 영역