티스토리 블로그에 sharebutton.net 소셜네트워크 공유 버튼 설치하는 방법티스토리 블로그에 sharebutton.net 소셜네트워크 공유 버튼 설치하는 방법

Posted at 2016.10.06 00:00 | Posted in 블로그팁

 티스토리 블로그는 플러그인 설정의 글 내보내기 항목에서 SNS 글보내기를 사용하면, 포스팅 하단에 KakaoStory와 twitter 및 facebook 공유 버튼이 적용 되며, 모바일 웹에서는 쉐어 아이콘을 클릭하여 카카오톡과 카카오스토리, 트위터와 페이스북, 네이버 밴드와 이메일 등으로 보낼 수 있습니다. TISTORY 스킨에서도 기본적으로 SNS 버튼이 추가되어 있는 디자인이 많으며, AddThis와 Shareaholic 등에서 제공하는 다양한 형태의 플러그인을 적용하여 사용하기도 하는데, 이번 포스팅에서는 티스토리 블로그에 sharebutton.net 소셜네트워크 공유 버튼 설치하는 방법에 대해 소개해 드리도록 하겠습니다.

 

 

* sharebutton.net

 

홈페이지: http://sharebutton.net/

 

※ 쉐어버튼은 회원 가입 후 로그인 없이도 사용할 수 있으며, 화면의 소스 코드 우측 상단의 'virtical share >'를 클릭하면 세로형, 'horizontal share >'를 클릭하면, 가로형으로 표시가 됩니다.

 

 

※ 쉐어버튼은 기본 값에서는 페이스북과 트위터, 구글 플러스와 +(추가) 원형 버튼이 4개 표시가 되며, 노란색 '+' 추가 버튼을 눌러 Google과 GMail, Blogger와 Amazon, LinkedIn과 Tumblr 등 20개의 서비스 중에서 선택하여 공유 할 수도 있습니다.

 

 

※ 쉐어버튼은 세로형의 경우 twitter와 facebook, Google+ 및 추가 버튼이 브라우저 웹 페이지 영역 좌측 상단 54픽셀 ~ 214픽셀 영역에 고정되어 표시가 되며, 가로형의 경우 가로형의 경우 하단 우측에서 좌측 방향으로 54픽셀에 ~ 214픽셀 영역에 고정되어 항상 화면에 나타나게 됩니다.

 

 

※ 티스토리에 쉐어버튼 추가하는 방법은 'sharebutton.net'에서 세로형 또는 가로형 중 소스 코드를 복사한 후 'TISTORY 관리 - 꾸미기 - HTML/CSS 편집 - HTML'으로 이동 한 후 '<body> ~ </body>' 사이 영역에 붙여넣기 한 다음, 상단의 '저장' 버튼을 누르면 적용이 됩니다.

 

 

 

 티스토리 블로그에 sharebutton.net 소셜네트워크 공유 버튼을 설치하면, 화면 좌측 상단 또는 우측 하단에 고정된 형태로 표시가 되어, 페이스북과 트위터, 구글플러스와 추가 버튼을 눌러 20여개 서비스에 글을 내보내기 할 수 있는데, 참고로 브라우저 창의 크기를 줄이는 경우에는 블로그 컨텐츠 화면 위에 겹쳐지는 형태로 표시가 되어 모니터 해상도가 가장 많이 사용하는 '1920×1080'이나 '1650×1050', '1366×768' 픽셀에서는 문제가 되지 않지만, 블로그 레이아웃의 폭이 넓거나 반응형 스킨 사용 여부에 따라 '1280×1024'이하의 디스플레이에서는 애드센스나 컨텐츠 영역에 겹쳐서 표시 될 수도 있기 때문에 적용 시 구성도 고려 해야 합니다.