iscle [イズクル] - あなたの生活に役立つネタを!

facebookページの内容をサイトに表示させる『Like Box』設置手順

竹中文人
執筆者:
[最終更新日]2014/06/05
[カテゴリ]Web・IT

facebookページは企業だけでなく、個人・団体なども利用するケースが多くなり、ファンやメンバーとのコミュニケーション・ツールとして活用されています。このfacebookページはfacebook上だけで展開するのではなく、ホームページ上にも設置・表示させることが可能です。

もう既に設置しているという方も多いかもしれませんが、よく「どうやって設置すれば良いか教えて欲しい」「設置を代行して欲しい」という依頼も多いので、今回はfacebookページの内容をサイトに設置・表示させる手順を紹介致します。

iscleでも設置していますが、設置すればこのように表示されます。設置することで[いいね!]を押してくれる機会も増やすことが可能です。
like-bokの表示例

『Like Box』設置手順

上図のような表示は、facebookのソーシャル・プラグインの中にある『Like Box』と呼ばれるものです。では、この『Like Box』を設置するために下記のURLへアクセスしましょう!
https://developers.facebook.com/docs/plugins/like-box-for-pages

アクセスできたら下記の項目を設定します。
like boxの設置

    • [Facebook Page URL]…facebookページのURL
    • [Width]…横幅
    • [Height]…縦幅
    • [Color Scheme]…背景の色(明るいor暗い)
    • [Show Friends’ Faces]…顔写真を表示
    • [Show Header]…「facebookもチェック」のヘッダーを表示
    • [Show Posts]…facebookページの投稿を表示
    • [Show Border]…枠の線を表示

コードを取得

項目の設定ができたら[Get Code]をクリックします。コードの種類を選択することができますので今回は一番簡単な[IFRAME]を選択してください。表示されるコードをコピーして、サイトの設置したい場所に貼り付けてください。
like box のコード取得

どうでしょうか?とても簡単に設置ができてしまいます!facebookページを利用しているのであれば、ぜひサイトにも設置してアピールしてみましょう。