ホームページなどに表示してFacebookページへの「いいね！」を促すソーシャルプラグイン「Like Box」ですが、このLike Boxは現在deprecated（非推奨）とされており、2015年6月23日にサービスが終了します。また、これに代わるFacebookプラグインとして新たに、｢Page Plugin」が提供されています。
今回は、Like BoxからPage Pluginへの移行で何が変わるのか、何に注意すればよいのかを見ていきたいと思います。
Like Boxをそのままにしておくとどうなる？
サービスの提供が終了する6月23日以降もLike Boxのコードをそのままにしておいた場合はどうなるのでしょうか？
FacebookデベロッパーのLike Boxページを表示すると、現在は以下のメッセージが表示されています。
これを見ると、もしLike Boxのコードを使用し続けている場合も6月23日からは自動的にPage Pluginに切り替わるようですので、該当部分がいきなり非表示になったりする訳ではなさそうです。
6/23追記：Like Boxのコードのままでも、自動的にPage Pluginに切り替わることを確認しました。カバー写真無しのPage Pluginに変更されるので、見た目もLike Boxのときとほぼ変わらず、違和感がありません。
ただ、非推奨となったFacebookプラグインのコードがいつまでサポートされるのかはわかりませんので、あらかじめ手動で差し替えておくのが良いかもしれません。
Page Pluginへ手動で差し替える方法は？
Like BoxからPage Pluginへの差し替えは以下の手順で行えます。
- Facebook Page Pluginのページへアクセスする
- 各項目の設定を行う
- 出力されたコードをサイトに貼り付ける
まず、Facebookデベロッパー「Page Plugin」のページへアクセスします。
設定項目：
- Facebook Page URL
- Width
- Height
- Adapt to plugin container width
- Show Friend’s Faces
- Use Small Header
- Hide Cover Photo
- Show Page Posts
1. Facebook Page URL
表示したいFacebookページのURLを入力します。
2. Width
Page Pluginを表示する幅のピクセル数を180〜500で入力します。
何も入力しない場合は自動的にデフォルトの340pxで表示されます。
なお、以前は設定可能な数値が「280〜500」となっていたこともありましたが、仕様が変更され、表示幅の自由度が広がりました。
3. Height
Pgae Pluginを表示する高さをピクセル数で入力します。
以前は設定可能な最小値が130となっていましたが、現在は70〜で設定可能です。高さを制限する理由がなければ、何も入力しなくても問題ありません。
4. Adapt to plugin container width
ページが読み込まれた際に、自動的にPage Pluginがある親要素の幅いっぱい（最大幅は「width」で設定された値）で表示されます。
レスポンシブWebデザインの場合は、ここにチェックを入れて「width」に「500」を入力しておき、親要素のCSSで幅を調整するのがおすすめです。
5. Show Friend’s Faces
今までFacebookページに「いいね！」をしてくれたユーザーのプロフィール画像が表示されます。
6. Use Small Header
ヘッダーのカバー画像の高さが約半分ほどになり、シェアボタンも非表示となります。
7. Hide Cover Photo
カバー写真を非表示にし、シンプルな白背景となります。
見た目は今までのLike Boxと近いかもしれません。
8. Show Page Posts
Facebookページの投稿のタイムラインが表示されます。
各設定が終わりましたら、左下の「Get Code」ボタンをクリックします。
上記のようにダイアログが表示されますので、発行されたコードのうち、1のほうをBODYタグの開始直後、2のほうをPage Pluginを表示させたい箇所に貼り付けます。
その他の非推奨Facebookプラグイン
現在、非推奨とされているFacebookプラグインは他にも「Activity Feed」｢Recommendations Feed」｢Facepile」｢Registration Plugin」｢Shared Activity」等があります。
もしこれらを設置しているサイトがある場合は、Like Boxとあわせてチェックしておいたほうが良さそうです。
AIの導入に躊躇されている企業様は、まずは1つのツールだけでも利用してみてはいかがでしょうか？EC×ChatGPTをはじめとしたAI企画から導入・運用まで、経験豊富な弊社プロ人材が手厚くサポートいたします。
