[티스토리] SNS 공유버튼 만들기

이전 포스팅을 보신분들은 아시겠지만

FastBoot 스킨을 적용하다 실패했습니다 ㅠㅠ

그러다보니 AddThis 를 이용해 SNS 공유버튼 만들어 놓은것도 같이 사라졌네요

 그래서 겸사겸사 여러분들께 소개도 할겸 다시 달아보았습니다.

사실 티스토리에서 기본적인 SNS 공유버튼을 제공하고 있습니다.

제일 아래쪽으로 내려보시면 페이스북이나 카카오톡, 트위터로 공유할 수 있는 버튼이 보이실텐데요

원래 제공하는 버튼보다 좀 더 이쁘고 눈에 띄게 할 방법이 없을까 찾아보다가 

AddThis 를 알게 되었습니다

접속 주소는 www.addthis.com 입니다.

처음 접속하시면 아래와 같은 화면이 보입니다.

구글이나 페이스북을 통한 로그인 또는 이메일로 신규 가입을 통해 로그인을 해주시면 됩니다.

로그인 하시게 되면 위에 메뉴가 있는 화면 또는 'Select a tool' 이라고 보이는 화면이 보입니다.

(상황별로 다른데 어떤 조건때문인지는 찾지 못했습니다.)

'Select a tool' 인 경우엔 간단하게

Share Buttons 를 선택하시면 됩니다.

만약 아래와 같이 상단에 메뉴가 보이는 화면이라면

Tools 를 선택하시고 가운데 보이는 + 를 눌러주시면 됩니다.

이제 원하시는 모양의 버튼을 만드시면 되는데

저는 Sidebar를 선택했습니다.

다음 단계로 넘어가면

버튼의 위치와 어떤 SNS를 연결할지에 대한 세팅을 합니다.

버튼 위치는 데스크탑인 경우와 모바일인 경우로 나누어져 있으니 원하시는 위치를 선택하시면 되고

'Select your own' 라디오 버튼을 선택하여 

원하시는 SNS 서비스를 추가, 삭제, 또는 버튼의 위치변경도 가능합니다.

저는 아래와 같이 세팅을 해보았습니다.

다 정하셨다면 'Save & Continue' 를 선택해주세요~

마지막단계로 코드 복사를 해주시면 됩니다.

복사를 하셨다면 이제 티스토리 관리 페이지로 돌아가셔서

HTML / CSS 편집 을 선택해주세요

코드 복사화면 아래쪽에도 설명이 되어 있지만

복사하신 코드는 </body> 문구 위쪽에 넣어주시면 됩니다.

스크롤로 내려가며 찾기는 힘드실수도 있으니 컨트롤+f 를 통해 '/body' 를 검색해 주세요

티스토리 편집까지 끝나면

아래와 같이 SNS 공유 버튼이 추가된것을 확인하실수 있습니다