티스토리 블로그 SNS공유버튼 달기 Share This 이용하여 간단하게

그리복잡하지 않은 SNS 공유버튼

안녕하세요? 이번에 공유버튼을 설치하려고 알아보다가 괸찮은 곳이있어서 적어봅니다. 원래는 addthis 에서 할려고 했으나 여기는 바야바의 자바를 제거해야지만 설치가 되더군요.. 그래서 다른곳으로 Sharethis 를 찾아서 설치하게되었습니다.

http://www.sharethis.com 홈페이지이며 회원가입은 그냥 이메일만 적으면 됩니다.

홈페이지에 접속하시고 체크해놓으신 부분을 클릭합니다.

클릭하시면 위에처럼 사이트의 형태가 나오는데 티스토리는 그냥 웹사이트로 들어가시면 됩니다. 네이버블로그는 음.. 잘모르겠습니다. 개방형 사이트가 아니라서.. 일단 웹사이트 하시고 넥스트 누르시면됩니다.

공유버튼 방식이 여러가지 있습니다. 그냥 버튼만 추가해서 내가 원하는곳에 넣는 방식이 있고 사이드바와 상단 하단부분에 넣는 방식이 있습니다. 저는 사이드바 부분을 선택해 보겠습니다. 사이드바 선택하시고 넥스트로 넘어갑니다.

그러면 사이드바 오른쪽에 할건지 왼쪽에 할건지 선택을합니다. 저는 오른쪽으로 선택하였습니다. 그리고 왼쪽에 기본적인 SNS 공유버튼이 있으며 우측에 추가적으로 넣고싶은 버튼 목록이 있습니다. 드레그 하셔서 옮기시면 바로 넣으실수 있습니다.

다정하셨으면 Get the Code 를 클릭합니다.

소스코드삽입

클릭하시면 소스코드가 2개가 나옵니다. 스크립트 방식으로 나오며

1번에 있는것은 skin </head> 윗부분에 넣어주시면 되시고 2번째는 skin의 자기가 원하는 중간정도?넣어주시면 됩니다.

저는 코드를 이런식으로 넣었습니다. 위에는 1번소스코드이며 아래는 2번 소스코드입니다.

완성작품

완성작품입니다. 사이드바 우측에 각종 공유버튼이 플로팅으로 움직이는것을 확인하실수 있습니다. 아이콘부터 모두 해야하는 번거로운 작업은 제외하고 다른 사이트에서 마든것이지만 소스만 넣어주면 공유기능을할수있으니 이런식으로 사용하시면 편리하실것같습니다.

참고로.. 제블로그만 그런것일수 있으나 바야바 광고중이신 분들은 addthis쪽 공유버튼이 안나옵니다. 바야바 소스를 삭제하면 나오고.. 물론 아닐수도 있으니 아시면좀 알려주시면 감사하겠습니다.

빛과사람그리고나