はじめまして。みなさま。ブックマークの用意はいいですか？
株式会社アクトゼロで、ソーシャルメディアを使った企画制作のディレクターをしている、黒沼です。今日から、毎週金曜日にソーシャルメディアの制作物をつくるときに、疑問に思いがちな部分の解説や、知っておくと便利なTIPSなどをお伝えしていきます。
”Social Plugin(ソーシャルプラグイン)”の全解説
さて、今回はfacebookの機能や情報を、Webサイト上で展開したい時に使う、”Social Plugin(ソーシャルプラグイン)”の全解説です。facebookが公式に提供しているプラグイン機能となります。
このサイトで吐き出したコードを、HTMLに貼りつけるだけで、普通のWebサイトにfacebookのあれやこれやの機能や情報を追加することができます。
そのまえに…iframe版とXFBML版について
これから解説する、以下のソーシャルプラグインによっては、コードを書き出す際に2つの形式が用意されている場合があります。iframe版は吐き出されたコードをそのままHTMLに貼り付けるだけで動作します。
XFBML版はfacebook専用言語なため HTML内に以下のタグを入れて、JavascriptSDKを読み込む必要があります。
XFBML版しか用意されていないプラグインもあるため、知ってて損はないと思います。
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : ‘YOUR APP ID’,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
では、早速個別に見ていきましょう。
今回解説するのは、以下の5つのソーシャルプラグインです。
いいね！ボタン(Like Button)
「いいね！ボタン」は、facebookソーシャルプラグインの中で、最も使用率の高いプラグインです。
「いいね！ボタン」の機能は、そのボタンを押すだけで、特定のURLについて「いいね！」の意思を示すことができるボタンです。ボタンを押したユーザーがFacebookアカウントを持っている場合は、いいね！のカウント数が増加し、押したユーザーのウォール上にその行動が流れます。アカウントを持っていない場合には、「いいね！ボタン」のカウント数が増えるのみです。
Facebookページの上部についている「いいね！ボタン」も、FacebookページをURLと指定した「いいね！ボタン」と考えてOKなので、同じ機能の「いいね！ボタン」をFacebook外のWebサイトに設置することも可能です。
アクトゼロのFBページを対象にした、いいね！ボタンを3つのパターンで出してみました。
Standard
button_count
box_count
設置タグを発行する際の設定事項はこちらをご覧ください。
Send Button
Send Buttonは、今年4月にリリースされた新しいプラグインです。対象のURLをfacebook上の友人や、特定のメールアドレスへシェアすることができます。シェアした内容は、自分のウォールには流れないため、特定の人にのみ教えたい場合に使われることを想定された機能です。XFBML版しか現時点では用意されていません。
サンプル
設置タグを発行する際の設定事項はこちらをご覧ください。
Comments
facebookで使われているコメントシステムを、サイト上でも使用できるプラグインです。書きこもうとするとfacebookアカウントでの認証を求められ、facebook上のアイコンや名前を使ってコメントを残すことができます。
facebookのアカウントと結びつくため、荒れにくいのが特長で、このブログの最下部のコメントシステムにも使用しています。
ただ、荒れにくいことは荒れにくいのですが、「管理画面から特定のコメントを削除する」といった、管理者向けの機能はないため、管理が必要な場合は、使用はおすすめしません。
設置タグを発行する際の設定事項はこちらをご覧ください。
Activity Feed
ActivityFeedは、特定のドメインについて、最近どんな行動(発言・いいね！など)がFacebook上で行われたかを表示するプラグインです。このプラグインを見たユーザーがfacebookユーザーだった場合、その友人のアクティビティが優先的に表示されます。友人でいっぱいに埋まらないときは、知らない人の行動が表示されます。うーん、あんまり使いどころがない気がしますね。
サンプル
設置タグを発行する際の設定事項はこちらをご覧ください。
最後のRecommendationsについてはこの後解説します。
Recommendations
Recommentationsは、特定のドメインについて、おすすめの情報を表示するプラグインです。謎の多いプラグインで、おすすめの基準はfacebook内部で独自に用意されるのですが、日本語のドメインを指定しても、まともなおすすめ情報はまだ出てきません。国内での利用は、まだ現実的ではないかもしれません。
サンプル
設置タグを発行する際の設定事項はこちらをご覧ください。
以上で前半5つのソーシャルプラグインの解説は終了です。特に、LikeButtonやCommentsは、企業サイトなどをソーシャル化する際にもよく使われるプラグインなので、是非試してみてください。
次回、残り5つのソーシャルプラグインについては、今週金曜日に公開する予定です。はてブとかしていただけると、すごくうれしいです。 それではまた！
