【SNS】 SNSボタン設置方法(Twitter, Facebook, Google+1)

ソーシャルメディアの各ボタン(SNSボタン)設置する方法のまとめ

■Twitter (ツイートするボタンの設置)

http://twitter.com/goodies/tweetbutton/


<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

※属性「data-count」を変更すると表示スタイルが変わるようです。(vertical、horizontal、none)

■Facebook(いいね!ボタンの設置)

http://developers.facebook.com/docs/reference/plugins/like/


<iframe src="http://www.facebook.com/plugins/like.php?
app_id=【AppID】&href=【URL】
&send=false
&layout=box_count
&width=450&show_faces=false
&action=like
&colorscheme=light&font&height=90"
scrolling="no" frameborder="0"
style="border:none; overflow:hidden; width:450px; height:90px;"
allowTransparency="true"></iframe>

※属性「layout」を変更すると表示スタイルが変わるようです。(standard、button_count、box_count)
※属性「show_faces」を変更すると顔写真の表示有無を設定できます(true、false)

■Google+1(+1ボタンの設置)

http://www.google.com/webmasters/+1/button/



<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>


<g:plusone size="tall"></g:plusone>

※<g:plusone>の属性「size」を変更すると表示サイズが変わります。(属性なし[標準]、small、medium、tall)