얼마전에 Zet님의 블로거팁 닷컴에서 Add This에 대한 소개를 읽고 저도 한 번 블로그에 적용해봐야겠다는 생각을 했습니다. RSS 버튼과 이메일 구독 버튼을 이미 달아두었지만, 아직 RSS보다 즐겨찾기를 더 즐겨 사용하시는 분들도 많기 때문이죠. 저도 대부분 자주 가는 블로그를 위자드닷컴을 통해 RSS로 구독하고 있기는 하지만, 종종 즐겨찾기도 이용을 하고 있습니다.

블로거팁닷컴 - 블로그에 만능 북마크 버튼을 달아보자, Add This

그런데 막상 Add This에 들어가보니 너무 많은 북마크 서비스를 동시에 보여주어 사용자에게 혼란을 줄 수도 있다고 생각했습니다. 더군다나 Add This에서 제공하는 북마크 서비스 중의 대다수는 국내 사용자들이 거의 사용하지 않는 것들이 많았습니다. RSS보다 즐겨찾기를 선호하시는 분들 중에는 아직 web 2.0 서비스에 익숙하지 않은 분들도 많은데 말이죠.
그래서 즐겨찾기 버튼 이미지를 자작하고, 간단한 자바스크립트를 통해 즐겨찾기 버튼을 만들어보기로 했습니다.

그 결과물을 공개합니다. (제 블로그 사이드바에 적용된 모습)


버튼이미지는 기존 RSS이미지를 수정해서, 알아보기 쉬우면서도 지루하지 않은 폰트를 사용해 만들어 봤습니다.


위의 버튼 이미지는 얼마든지 다운받으셔서 사용하셔도 됩니다. 이미지를 다운받으시는 방법은, 만약 제 블로그에서 오른쪽 클릭이 안되신다면, 아래 스크립트 소스 중에 이미지 주소 부분을 클릭하시면 다운받을 수 있으실겁니다.

이 버튼을 클릭할 때, Explorer의 즐겨찾기 추가 박스를 띄워주는 자바스크립트는 아래와 같습니다.
copy&paste가 안되신다면 링크된 텍스트 파일을 다운받으세요.

<script type="text/javascript">
function bookmark() {
window.external.AddFavorite('http://블로그주소','블로그이름')}
</script>

<a href="javascript:bookmark();"><img src="http://cfs.tistory.com/custom/blog/19/195565/skin/images/bookmark.jpg" width="80" height="18" border="0" alt="즐겨찾기에 추가" /></a>

상반부의 <script> 로 시작하여 </script>로 끝나는 부분이 스크립트 부분이고, 하반부 부분이 링크 부분입니다. (글자가 벌어져보이는 것은 띄어쓰기가 아니고 양쪽정렬 때문입니다)

적용하는 방법을 알려드리자면, 위의 소스 중에 블로그 주소와 블로그 이름(즐겨찾기에 표시되는 이름)을 채워넣으시고, 그냥 원하시는 부분(스킨의 적당한 위치 혹은 사이드바)에 삽입하시면 됩니다. 스킨에 넣으실 경우 티스토리의 스킨 편집 기능을 사용하시면 되고, 사이드바에 넣으실 경우 코드배너를 추가하셔서 소스를 삽입하시면 되겠습니다. 상반부 스크립트 부분과 하반부 링크 부분은 꼭 붙어있을 필요는 없습니다. 상반부 스크립트 부분은 스킨 헤더에 삽입해두시고, 아래 링크부분만 원하는 부분에 입력하셔도 됩니다. 이미지 링크 주소(빨간부분)을 그대로 사용하셔도 무방하지만, 그럴 경우 제 블로그 설정에 따라 링크가 깨질수도 있으니, 가능하면 다운받으셔서 업로드하시고, 이미지 주소를 새로 입력하시는 것을 추천합니다.

이제 여러분의 블로그에 간단히 즐겨찾기 추가 버튼을 달아보세요~ ^^
그리고 제 블로그를 즐겨찾기에 추가해주시는 센스~!

[연관글] 2008/05/25 - [블로그 이야기/블로그 팁] - 메타블로그 추천버튼 호박님 엠블럼 버전으로 수정

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

이 포스트를 더 많은 분들과 함께 보시려면 추천 버튼을 눌러주세요~!