まず、デザインにこだわらない人やコードがよく解らない人は忍者おまとめボタンを利用するのが手っ取り早いと思います。
実際のコードを貼り付けるとこんなんです。
忍者おまとめボタン
Entry//
ただし、このサービスは付けたくもないボタンまで付いてくるし、必要不可欠な「はてブ」ボタンが付いてなかったりで痒い所に手の届かない微妙なサービスだったりします。
なので今回は「いいね」ボタンを記事ごとに単体でつける方法を紹介します。
コードの取得はこちらから行います。
http://developers.facebook.com/docs/reference/plugins/like/
そして実際に取得し、当ブログに貼りつけたコードはこちらです。
2分割になっています。
一つ目のコードは<body>直下に貼り付けます。
<!--FacebookのSDKコード-->
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<!--/Facebook--> |
2つ目のコードはボタンを設置したい箇所に貼り付けます。
このコードはブログごとに変更箇所がありますので注意して下さい。
<!--Facebookボタン-->
<div class="fb-like" data-href="http://rokufc2.blog.shinobi.jp<!--$entry_link-->" data-send="true" data-layout="button_count" data-width="200" data-show-faces="true"></div>
<!--Facebookボタン--> |
変更箇所はdata-hrefのリングURLをブログのURLに書き換えるだけです。
赤文字の所を自分のブログのURLに書き換えてスラッシュを挟まないで<!--$entry_link-->と記載します。
<!--$entry_link-->は忍者ブログの独自タグで記事ごとのURLの末尾の部分にあたります。
PR
