ブログに興味を持ってもらった方と交流（コミュニケーション）の場である「facebook ページ」。これを紹介するために、ブログのサイドバー・フッターに設置していた部品（facebook Likebox）の仕組みが2015年6月に変更となったので、新しい仕組みを使って再設定しました。
この新しい仕組みでの設定方法をまとめました。
facebook Likebox が2015年6月23日 廃止
いままで、ブログにfacebookページを紹介する部品だった「facebook LikeBox」でした。この仕組みが2015年6月23日に廃止されました。いままで使っていた LikeBox については、新しい設定へ手動で切り替えを行うようにアナウンスされています。
これが従来のfacebook Likeboxの表示です。
- Facebook Like Box → https://developers.facebook.com/docs/plugins/like-box-for-pages
なお、英語原文によると、置き換えを行っていない LikeBox は、当面の表示そのものは止まらないようです。ただし、表示そのものは古いままになってしまうので、手動で切り替えを行う必要があります。なので、切り替え期日（6月23日）も過ぎているので、早急に変更する方がいいと、個人的には思います。
新しい仕組みは「Page Plugin」
ブログにfacebookページを紹介する部品を作る新しい仕組みは「Page Plugin」です。
- Page Plugin → https://developers.facebook.com/docs/plugins/page-plugin
新しいPage Pluginを使うと、以前と違い「ページのカバー写真」を活かしたデザインになります。特徴として標準サイズが、横340px・高さ500pxになります。そして、以前のLikeBoxより選択できるサイズの幅が狭くなり、横のWidthは280pxから500px・縦のHeightは130px以上はです。800pxとかのサイズが指定できなくなりました。
設定方法
作成するのに必要なのは、facebookページのURLアドレスです。そのアドレスをこのページにを開いて入力します。
- Page Plugin → https://developers.facebook.com/docs/plugins/page-plugin
facebookページのURLアドレスを「Facebook Page URL」に入力すると、下にそのfacebookページが表示されます。
Widthには、180から500の間の数字を入力します。これは配置するサイドバーの幅と合わせると綺麗に収まります。Heightは基本的に指定しなくて、OKです。
- 「Adapt to plugin container width」とは、配置した場所の横幅に合わせてくれる機能です。なので、チェックを入れて「ON」のままにします。
- 「Use Small Header」にチェックを入れると、カバー写真の領域を小さく表示できます。
- 「Hide Cover Photo」をチェックすると、カバー写真なしの表示になります。
- 「Show Friend’s Faces」は、イイねを押してくれている友人を表示してくれる機能です。基本的にはチェックを入れておくのをオススメします。
- 「Show Page Posts」は、そのfacebookページの「投稿」を表示します。これはお好みでチェックを入れていください。
- このサイトの場合は、ほぼ毎日のタイミングで更新しているスタッフ通信を紹介したいので、facebookページの「投稿」を表示しています。
一方、ものくろぼっくす（ブログ）のサイドバーに配置しているときは、読み手の方はブログを読みたいという気持ちが強いのであまりアピールせずに、facebookページの投稿は、facebookページに来てくださいという形で、自分はチェックを外しています。
チェックをオン・オフすると、プレビュー表示も変化しますので試しながら、選択してください。
facebook Page Plugin コード
設定ができたら、左下にある青いボタンの「Get Code」をクリックします。すると、サイトに設置するためのコードが表示されます。
このコードが2つに分かれていますが、はじめの「1」の方は、ページで一度だけ読み込みすればOKの前段取り（JavaScriptをロードしている）の部分です。bodyタグの後に配置してほしいと案内（理想はbodyタグの直後）されています。
後の「2」の方が、実際にfacebookページの部品を表示する命令が書かれています。つまり、この「2」を複数設置すると、ページに複数（例えば、サイドバーとフッターなど）のacebookページの部品を表示できます。
WordPressで表示するには
1つ、このfacebookページの部品を表示する場合は、難しく考える必要はありません。
サイドバーやフッターの配置したい「ウィジェット」の場所に「テキスト ウィジェット」を配置して、先の両方のコードを貼り付けます。1つ表示するだけなので、おなじ場所（ウィジェット）に「1・2」の順番に貼り付けます。
実際のテキストウィジェットに貼り付けているスクリーンショットがこちらです。
これで、新しいfacebook Page Pluginの部品がブログに表示されます。