『Like Box』（いいね！ボックス）を作成してブログ（Blogger）に貼ってみました

前回の記事では、フェイスブックの『ソーシャルプラグイン』について、いくつか簡単に紹介しました。

ソーシャルプラグインをブログやホームページに設置するとことで、ＳＮＳ（ソーシャルネットワーキングサービス）と外部サイトの連携ができ、WebサイトにＳＮＳとしての機能を加えたり、より多くのユーザーにサイトを見てもらえる可能性が広がります。

今回はフェイスブックのソーシャルプラグインの一つである『Like Box』（いいね！ボックス）について。

先日、『Like Box』（いいね！ボックス）をこのブログ（Bloggerブログ）にも設置しましたので、その方法を覚書きついでにご紹介しておこうかなと思います。

『Like Box』（いいね！ボックス）は、お持ちのFacebookページをブログやホームページに貼り付けて紹介することができるプラグインです。

まずは下記のリンクより『Facebook　developers』にアクセスします。
『Like Box』（いいね！ボックス）

こちらが『Like Box』（いいね！ボックス）の生成ページです。
下の画像、赤枠部分にある入力枠に、それぞれ情報を入力していくことで、簡単に『Like Box』（いいね！ボックス）を作ることができます。

情報の入力欄の下には、作成中の『Like Box』（いいね！ボックス）のプレビューが表示され、詳細の変更とともにプレビューも変更されます。
作成後のボックスをイメージしながら作業することができますね。

それぞれの入力項目の説明です。

『Facebook Page URL』→お持ちのFacebookページのＵＲＬを入力します。
『Height』→ボックスの高さ
『Width』→ボックスの幅
『Color Scheme』→ボックスの配色

チェックボックス
『Show header』→ヘッダー部分の表示のオン・オフ
『Show Faces』→いいね！をしているユーザーのプロフィール画像のオン・オフ
『Show Stream』→Facebookページ内投稿の表示のオン・オフ
『Show Border』→ボックスの外枠のオン・オフ

こちらはそれぞれのチェックボックスが対応している部分です。
チェックを外すことでそれぞれのパーツを外すことができます。



作成が終了したら、左下の『Get Code』をクリックします。

これで『Like Box』（いいね！ボックス）をサイトに貼り付けるためのコードが表示されました。
私はBloggerブログのサイドバーにボックスを表示したかったので、『IFRAME』を選択しました。

『IFRAME』に表示されているコードをコピーします。

あとはBloggerブログにログイン→レイアウト→ガジェットを追加→HTML/JavaScriptガジェットに貼り付けで、無事『Like Box』（いいね！ボックス）が表示されました。

今回のように、Webデザインの知識がまったくない私でも、ボックスをブログに表示させることができました。

『Like Box』（いいね！ボックス）の作成も、英語表記ですが感覚的な操作で作成することができると思います。
Facebookページをお持ちの方は、ぜひ一度お試しを。

もしブログが参考になりましたら、ぜひ『いいね！』をお願いいたします。