[Facebook]公式の「ソーシャル・プラグイン」のコードを貼っても真っ白に。

世界最大のSNS「Facebook」。

会社・団体・Webサイトについて、mixiのコミュニティに該当する「Facebookページ(旧名ファンページ)」を作成できますが、作成した後、当然、告知をしていく必要があります。

一番メジャーな方法としては、自分のWebサイト上に「ブログパーツ」を貼ることですよね。

Facebookには多くのプラグインが用意されていて、多くのサイトでみかける「Like Box」というタイプのプラグインは下記から設定・コード取得を行うことができます。

Like Box - Facebook開発者

ここで、下記項目などを設定をし、コードを発行します。

Facebook Page URL
対象とする自分のFBページURL
Width
プラグインのヨコ幅
Color Scheme
デザインを「light」と「dark」から選択
Show Faces
「いいね!」を押してくれているユーザーのプロフィール写真を表示するかどうか
Stream
ウォールなどの更新情報を見せるかどうか
Header
「Facebook」のテキストが入ったヘッダーを表示するかどうか

設定をし、「Get Code」を押すと『Like Boxのプラグインコード』が発行されます。

「iframe」と「XFBML」の2つのコードが発行されますが、現在「FBML(Facebookの独自マークアップ言語)」は非推奨の方向ですので、「iframe」をコピーし、自サイトの任意の箇所へペーストします。

これで「無事に表示」と行きそうですが、、、なぜか真っ白になりますね。。(2011年4月5日現在)

どうやら発行されたコードに不具合がある模様。

なので、「Like Box」を表示しているサイトからコードを取り、パラメーターを変更するのが無難なようです。

例: TechCrunch Japan

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftechcrunchjapan&width=312&connections=10&stream=false&header=false&height=255" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:312px; height:255px;" allowTransparency="true"></iframe>

URLを変更し、「stream」などのパラメーターを『true』『false』などを変更して、貼り付けるのがベターかと。

関連するWeb制作・開発Tips

関連リンク