티스토리 뷰

블로그를 운영하다보면 블로그 하단에 SNS 공유 버튼이 있는 블로그를 보실 수 있을텐데요.


지식인에 질문을 올렸었는데 답변이 달리지 않아 직접 찾아보았습니다.



소스는 아래와 같습니다.


아래의 소스를 보면 페이스북(Facebook), 구글 플러스(Google Plus), 카카오스토리(Kakao Story), 네이버(Naver), 트위터(Twitter)의 공유소스가 있음을 확인할 수 있습니다.


<div class="SNS_Share_Top hidden-xs">

<!-- Share on Twitter -->

<a href="#" onclick="javascript:window.open('https://twitter.com/intent/tweet?text=[%EA%B3%B5%EC%9C%A0]%20'

+encodeURIComponent(document.URL)+'%20-%20'+encodeURIComponent(document.title), 'twittersharedialog',

 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Twitter"><img src="./images/Twitter.png"></a>


<!-- Share on Facebook -->

<a href="#" onclick="javascript:window.open('https://www.facebook.com/sharer/sharer.php?u='

+encodeURIComponent(document.URL)+'&amp;t='+encodeURIComponent(document.title), 'facebooksharedialog',

 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;" target="_blank" alt="Share on Facebook">

<img src="./images/Facebook.png"></a>

<!-- Share on Google+ -->

<a href="#" onclick="javascript:window.open('https://plus.google.com/share?url='+encodeURIComponent(document.URL), 'googleplussharedialog','menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=350,width=600');return false;" target="_blank" alt="Share on Google+">

<img src="./images/Google_Plus.png"></a>


<!-- Share on Kakaostory -->

<a href="#" onclick="javascript:window.open('https://story.kakao.com/s/share?url='+encodeURIComponent(document.URL), 'kakaostorysharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=400,width=600');return false;" target="_blank" alt="Share on kakaostory">

<img src="./images/Kakao_Story.png"></a>


<!-- Share on Naver -->

<a href="#" onclick="javascript:window.open('http://share.naver.com/web/shareView.nhn?url='

+encodeURIComponent(document.URL)+'&amp;title='+encodeURIComponent(document.title),

 'naversharedialog', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;" target="_blank" alt="Share on Naver">

<img src="./images/Naver.png"></a>

</div>



SNS 이미지들도 같이 올려드립니다.




파일 다운로드는 아래를 클릭하시면 받을 수 있습니다.





댓글