新ECおもろ

ECのちょっと先の未来を妄想してます。

フェイスブックの「いいね!」ボタンをとにかく簡単にサイトに追加する方法

最近フェイスブックの話題がネット上を駆け巡ってますね!


年明けにはデビッド・フィンチャーが創設者マーク・ザッカーバーグの半生を映画化した

ソーシャル・ネットワーク
も公開されるということで
こりゃますますフェイスブック流行りそう!!!


ということで、
tmixにもフェイスブックの「いいね!」ボタンをつけてみようとおもいます。


ちなみに、細かく設定を変えたりやmetaタグでタイトルなどもカスタマイズできるようなんですが、
今回はとにかく簡単に追加したい
というところを重視してます。


1.フェイスブックのプラグインページで、「いいね!」ボタンを設定する

フェイスブックのプラグインページで設定します。

ここでの設定はただ1つ、
上から2番目のLayout Styleを自分の好きな表示方法に変える
(今回はbutton_countを選択)だけでよいです。


ちなみに、
一番上の「URL to Like」に自分のサイトのURL(例えば http://tmix.jp/)を入れたくなったりしますが、
そうすると、
個別ページを同じ記述で対応できなくなる
ので入れないようにします。


でその後、Get Codeボタンをクリック。iframeと、XFBMLが表示されますが
上記でURLを入れていないためiframeのほうは使えません
XFBMLを選択します。

できたXFBMLはこんな感じ。

ちなみに使えないiframeはこんな感じ。(URLを入れていないため、example.comとなっている)

2.XFBMLを使えるようにフェイスブックに登録する

続いて、XFBMLを使うために、フェイスブックへサイトを登録します。登録は以下からできます。

フェイスブックアプリケーション登録画面

サイト名とURL、日本語を選択して終了。
あっという間。


3.XFBMLのタグをtmixに貼り付ける

あとはサイトにXFBMLのタグを貼り付けるだけ!!




というわけで思ってたよりも簡単だったんではないでしょうか?
(自分はドキュメント見ながら、迷いながらやったのでぜんぜん簡単でなかったですが。。。)


ぜひ自分のサイトに「いいね!」ボタン追加してみてくださいー!

ではまた!!




2010.11.02 追記

上記のままだとボタンは「いいね!」ではなく、「Like」になっていると思います。
「いいね!」にしたい場合は、できたXFBMLの"en_US"を"ja_JP"に書き換えれば対応できます。