Addthis를 이용한 블로그 글 SNS 공유 버튼 설치 사용방법::어나일언덕

블로그가 발전하려면 블로그의 방문자가 많아야 합니다. 블로그 방문자를 늘리는 방법 중 하나는 내글을 다른 사람들이 SNS나 본인의 블로그에 공유해 가는 것 입니다. 블로그 글을 쉽게 공유할 수 있도록 티스토리에서는 플러그인으로 SNS 글보내기 기능을 지원합니다.

하지만 이왕이면 다홍치마라고 공유 버튼을 더 이쁘게 꾸미고 싶다면 Addthis를 이용할 수 있습니다.

SNS 글보내기 Addthis

Addthis 홈페이지 링크

위의 링크를 클릭하면 아래와 같이 Addthis 홈페이지로 이동됩니다. 대부분이 그렇듯이 기능을 이용하기 위해서는 먼저 계정 등록과정을 거쳐야 합니다. 등록방법은 구글계정, 페이스북계정, E-mail 주소로 가능합니다.

세가지 등록 방법중 원하는 아무거나 선택한 뒤 등록절차에 따라 입력양식을 채워넣고 아래에 동의에 체크체크체크 열심히하고 Let's Get Stared를 선택하면 바로 이제 사용이 가능합니다.

등록 후 화면 우측상단의 클릭하여 Dashborad로 이동하면 자신의 계정의 상태를 확인할 수 있고 Addthis에서 제공하는 기능을 설정할 수 있습니다.

Share Buttons 설정 및 블로그 적용 방법

이제 공유 버튼을 만들려면 Dashboard 화면에서 좌측 상단의 TOOLS -> 다음 화면의 우측 상단의 ADD NEW TOOL -> 다음 화면의 첫번째 Share Butons 을 차례로 선택하면

아래와 같이 공유버튼을 설정해 줄수 있는 창이 나타납니다.

처음으로 설정해줘야 할 것은 공유버튼의 타입입니다.

위와 같이 Floating, Inline, Expanding, Image Sharing, Popup, Banner, Slider가 있으며 각각이 데스크탑과 모바일에서 어떤 형태로 화면에 표시 되는지를 오른쪽 화면에서 확인해 볼 수 있습니다.

- Floating : 화면 스크롤에 맞춰 같이 움직이는 바 형태

- Inline : 본문에 버튼 형식으로 자리잡는 형태, 티스토리 플러그인과 유사

- Expanding : 화면 우측하단에 숨겨져 있다가 마우스를 화살표에 가져다 대면 확장되는 형태

- Image Sharing : 본문 이미지에 마우스를 올리면 나타나는 형태

- Popup : 팝업창 형태로 나타나는 형태

- Banner : 본문 상단에 공유할래? 배너형태로 묻는 형태

- Slider : 화면 우측 하단에 숨어있다가 나타나는 형태

이 중에서 그나마 위의 세가지가 가장 무난하고 나머지는 별로 추천하고 싶지 않습니다.

개인적으로는 Floating은 화면을 따라다녀서 귀찮아 보여서 싫고, Inline은 티스토리 플러그인과 별다를게 없어서 Expanding으로 설정했습니다. 선택 완료를 했다면 Continue를 눌러 다음으로 넘어 갑니다.

다음으로 설정해줄 것은 버튼의 위치와 공유매체 디자인 그리고 기타옵션입니다.

Position은 공유버튼의 타입에 따라 설정이 약간 다른데 원하는 위치 설정은 크게 어려울 것이 없겠으니 넘어가고

Expanding에는 없는데 Floating의 경우에는 Share Counters가 있습니다.

이는 각 공유매체별로 몇번 공유가 되었는지를 카운트 하는 것으로 none 당연이 없고, individual은 매체별로 집계, Total은 합계입니다. 뭐 이타입을 안하면 상관없겠지만 정말로 잘나가는 블로그가 아닌 이상 그렇게 공유할 껀덕지가 많지 않을텐데 카운트하는게 뭐가 의미가 있겠습니까? 그냥 None으로 합시다.

Social Networks는 공유매체를 지정해 줄 수 있는데 자동을 추천해주지만 절대 자동으로 말고 아래에 Select your own을 선택 쓸데없는 것들은 없애고 Add more Services에서 우리나라의 실정에 맞는 카카오, 네이버라인 등을 추가해줘야 합니다.

Disign은 스타일과 버튼 크기, 버튼 색깔 등을 설정해 줄 수 있습니다.

Advanced Options도 각 타입별로 차이가 있는데 공통적으로 Show or Hide on Specific Pages는 블로그에서 설정이나 미리보기 등의 주소를 설정해두면 그페이지에서는 공유 버튼이 안보이게 할 수 있습니다. 또한 모바일 혹은 데스크탑에서만 보이게 설정할 수도 있습니다.

모든 설정이 끝났다면 Save & Continue 하면 설정은 완료 됩니다.

이제 마지막 한단계가 남았다고 하면서 Html코드가 나옵니다.