Social Plugins - Facebook開発者

開発者ページにfacebookが提供している公式プラグインの一覧があります。

やりかたは、よくあるブログパーツと一緒で、各プラグインのページで、いくつかのオプションを選んだりして、”Get Code”ボタンを押すと、貼り付けるHTMLコードが表示されます。これをブログのテンプレートにコピペすればOK。

facebookのプラグインは、2つコピペするコードがあって、1つはJavaScript SDKというもの。これはbodyタグのすぐ後ろに入れることが推奨されています。（なんでだろう。。）もう一つが実際にブログに表示したいプラグインのコード。これは表示したい位置にコピペします。

tumblrの場合は、「ブログのカスタマイズ」>「HTMLを編集」でテンプレートをカスタマイズできます。

~~とりあえず、Like ButtonとComments pluginを設置してみました。~~

テキスト投稿の場合だけ表示するようにして、Like Buttonだけにしました。（重たすぎて表示にすごく時間がかかるようになることが分かったので。）

各エントリーのいいねボタンを設定をするには、その記事に対するパーマネントリンクのURLを設定する必要があります。これは、data-hrefというdata属性に対応します。tumblrの場合は

<div class="fb-like" data-href="{Permalink}" data-send="false" data-layout="box_count" data-width="450" data-show-faces="true"></div>

というように属性を追加すれば完成です。