티스토리 #1 스킨 - AddThis 내 블로그 게시물 추천 슬라이드

이번에는 AddThis라는 서비스를 이용하여 내 블로그 게시물을 추천해주는 슬라이드를 보여주는 방법에 대해서 설명하려고 합니다.

이것은 AddThis라는 서비스의 API를 적용하였을 때 모습입니다. 적용 방법은 아래를 따라 하시면 됩니다.

AddThis 홈페이지 접속 (https://www.addthis.com/)

---

AddThis 홈페이지에 접속하여 Google, Facebook, Email로 중앙에 있는 버튼을 눌러 먼저 가입을 합니다. 

회원가입 후 로그인을 하시면 위와 같이 대시보드가 나오는데 좌측 상단에 TOOLS 메뉴를 선택합니다. 그리고 우측에 보면 ADD NEW TOOL 버튼을 누릅니다. 여러분은 처음 툴을 추가하는 거여서 Slider 항목을 추가하지 않아 안 보이실 겁니다.

Related Posts 버튼 클릭합니다.

Slider 코드 생성

---

블로그에 보이는 형태를 선택하는 화면인데 저는 Slider 형태로 보여주고 싶어 Slider를 선택하고 Continue 버튼을 눌렀습니다.

옵션을 선택합니다. 좌측하단, 우측하단, 타이틀, 색상 등을 설정합니다.

위와 같이 설정이 끝났다면 다음과 같은 코드가 생성됩니다.

<!-- Go to www.addthis.com/dashboard to customize your tools --> <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxxxxxxxxxxxxxxx"></script>

이 코드는 사용자마다 다르니 자신의 코드를 복사해야합니다.

HTML / CSS 편집

---

티스토리 관리자 페이지로 이동하여 HTML / CSS 편집 버튼을 누릅니다.

HTML 항목에서 제일 하단으로 스크롤을 내려주시면 </body> 태그가 있습니다. 태그 바로 위쪽에 아까 AddThis에서 복사했던 코드를 넣어줍니다.

<!-- Go to www.addthis.com/dashboard to customize your tools --> <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxxxxxxxxxxxxxxx"></script>

그리고 저장하시면 끝입니다.

※ 유의사항 - AddThis API를 적용했는데도 바로 보이지 않을수도 있으니 적용안된거라고 착각하시면 안됩니다. 

저는 하루 지나고 확인했습니다.