いやいや、違うんですって・・・Facebookのシェアボタンにはシェアボタンのいい所があるんですよ。
例えば、このアメブロにいいね！を押してくれた方のウォールを見てみましょう。
こうなりますよね。
OpenGraphProtocol（オープングラフプロトコル）を設定していないと画像サムネイルが選べないのです。
OGP（オープングラフプロトコル）についての記事はこちら。
ですが、シェアボタンならこういうことも出来るんです！
ほらね？同じ記事ですが、サムネイルがわかりやすく表示されましたね。
これ、実際使ってみるとひじょ～～～～～～～に便利です。
デメリットをあげるとすれば、いいね！ボタンはワンアクションで記事を自分のウォールに反映できますが、シェアボタンは別ウィンドウが立ち上がり、「リンクをシェア」のボタンを押さないと反映されません。ツーアクションなんですね。
メリットとしては、以下があげられます。
１、サムネイル画像が選択出来る。
２、シェアした記事を自分のウォール、友達のウォール、グループのウォール、自分が管理しているフェイスブックページのウォール、メッセージと選択出来る。
３、投稿する際の公開範囲が選べる。
では、実際に付けるのはどうすれば？
あ、めっちゃ簡単だったりします。
以下のコードを埋め込むだけです。
<a name="fb_share" type="button" share_url="【サイトのURL】">【ボタンに表示したい文字】</a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
こういう感じですね。
↓↓↓↓↓↓↓↓↓
ボタンを押すとウィンドウが立ち上がると思います。
操作方法は以下の画面のようになります。
これをアメブロに設置するにはどうすればいいのか？
どこに設置するか？によりますが、私の場合はコメント欄の上に設置しております。
コメント欄プラグインとGoogle+1ボタンと複合で設置しておりますので、以下のようなソースになってます。
<script>
$(function(){prohibitedTagsUse();});
</script>
<script type="text/javascript">
var current_uri = window.location.href;
var fb_notif = current_uri.indexOf("fb_comment_id=");
if (fb_notif != -1) {
var url = current_uri.substring(0, fb_notif);
window.location.replace(url);
}
</script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.3.2");</script>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>
<script src="http://connect.facebook.net/ja_JP/all.js#appId=205198886175941&xfbml=1"></script>
<script type="text/javascript">
var html = '<div id="fb-comments"><table><tr><th nowrap><g:plusone></g:plusone></th><th nowrap><a name="fb_share" type="button" share_url="">この記事をFacebookでシェアしてください♪</a></th></tr></table><div id="fb-root"></div><fb:comments href="%%current_uri%%" num_posts="10" width="420" migrated="1"></fb:comments></div>';
html = html.replace('%%current_uri%%', window.location.href);
document.write(html);
$(document).ready(function(){
uri = window.location.href;
_uri = encodeURI(window.location.href);
if (_uri.indexOf('/entry-') != -1) {
$("#fb-comments").insertAfter("#exLinkBtn");
} else {
$("#fb-comments").hide();
}
});
</script>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
これをコピペして、フリープラグインのところにペタっとやるわけです。
もし上手くいかない！なんて方はコメント欄にブログURLを付けてどういう風に上手くいかないかお知らせください。がんばってレクチャーいたします。
また、他のブログにも同様に付けられます。
各ブログによってつけ方が違いますので、ご相談には乗りますが・・・カスタマイズ料金を取るかもしれませんｗ
（親密度による・・・。）
ブログ読者登録はこちらです。
↓↓
