新しくつくるサイトにFacebookページを貼り付けようと思いました。以前「簡単！サイトにFacebookページのいいねボタンとタイムラインを表示する」という記事を書いたので、それを見ながら設置しようとしたらFacebookAPIのページで2015-6-23から仕様が変わるという事を知らされました(^_^;。
ということで、Facebookページをサイトに貼り付ける新しい方法について書きます。
FacebookのLIKE BOXが2015年6月23日で廃止の情報
https://developers.facebook.com/docs/plugins/like-box-for-pages
こちらになります。以前はここから貼り付け用のコードを作ることができたのですが、このように、
With the release of Graph API v2.3, the Like Box plugin is deprecated. Please use the new Page Plugin instead. The Page Plugin allows you to embed a simple feed of content from a Page into your websites.
If you do not manually upgrade to the Page Plugin, your Like Box plugin implementation will automatically fall back to the Page Plugin by June 23rd 2015.
自動翻訳したものを若干超訳すると、
グラフAPI v2.3デベロッパーのリリースでは、LIKE BOXプラグインが廃止されました。代わりに新しいページのプラグインを使用してください。ページのプラグインは、あなたのウェブサイトへのページのコンテンツを簡単にフィードを埋め込むことができます。
手動でページプラグインにアップグレードしない場合は、LIKE BOのプラグインの実装では、2015年6月23日に自動的にPage Pluginに戻ります。
となります。自動的にPage Pluginに戻ります、ということなので今まで設置してあったLIKE BOXはそのままにしておいても自動的に新しいプラグインとしてちゃんと動くと期待したいのですが(^_^;、今時点ではどうだかわかりません。ネットで検索をすると「廃止されるので動かなくなるから早めに置き換えを！」という論調が強いので、もしかすると(まだ、楽観的)動かなくなるかもデス。
Page Pluginから貼り付け用のコードを取得する
新しくFacebookページを埋め込むには今はもうPage Pluginしか方法がありませんのでやってみようと思います。
まずPage Pluginを使うにはApp IDの登録をする必要があります。App IDの登録をして、Page Pluginからコードを取得するまでを書きます。
App IDの登録をする
Facebook開発者 ページに行きます。
このように表示されるので右上の、
+ Add a New App をクリック
このように画面がポップアップするので一番右の WWW をクリック
右上の Skip and Create App ID をクリック
Display Name にアプリの名前(任意の名前)し、カテゴリーは ページ用アプリ を選択して Create App ID をクリックします
セキュリティチェックのために、目視で「xx(何かの名前)」が写っている写真を12枚の中から全部チェックして、送信 をクリック
ダッシュボードに戻り、App ID の作成が終了です。
Page Pluginから貼り付け用のコードを取得
https://developers.facebook.com/docs/plugins/page-plugin
このサイトから貼り付け用のコードを作ります。
FacebookページのURL、幅、高さ を指定します。すると青枠で囲ったところにプレビューが表示されます。オプションが幾つかあるのでチェックを付けたり、外したりして好きな形にします。
これで良ければ、
Get Code をクリック
こういう感じの画面が表示されるので、
アプリID の横の ▼ をクリック
先ほど作った App IDの名前を選択します
表示された １ の部分のソースコードを <body タグの直下にコピーします。
表示された ２ の部分のソースコードをFacebookページを埋め込みたい場所にペーストします。
WordPressで埋め込む場合
１の部分は使っているテーマフォルダで<body を指定してるファイルを探します。今回の場合、header.phpというファイルにその場所がありましたので、header.phpの
<body <?php body_class(); ?> style=" <?php echo $bg_style; ?> ">
この行の下に１のソースを挿入しました。大概の場合はheader.phpに <body> があるかと思います。
Facebookページの埋め込みはウィジェットで行いました。
ダッシュボード 外観＞ウィジェット をクリックして、
追加したいウィジェットエリアに テキスト を追加し、２のコードを貼り付けて 保存 します。
これで、
こんな感じに、Facebookページが表示されるようになりました(^^)/
↓関連記事
[ryus_blogcard url=https://usortblog.com//facebook-pageplugin-ryusblog/]
コメント
コメント一覧 （7件）
[…] 方法は、以下のサイトがとてもわかりやすく参考にさせてもらった。 http://usortblog.com//fblikeboxhaishi/ […]
[…] 方法は、以下のサイトがとてもわかりやすく参考にさせてもらった。 http://usortblog.com//fblikeboxhaishi/ […]
[…] サイトにFacebookページを貼り付ける方法がLIKE BOXからPagePluginに […]
[…] 参考サイト […]
バッチリできました！ 厚く御礼申し上げます。素晴らしいページをありがとうございました!!
zianminさん、おはようございます。コメントありがとうございます！記事がお役に立って用で何よりうれしいです(^^)/
[…] こちらのサイト様々ですね。 サイトにFacebookページを貼り付ける方法がLIKE BOXからPagePluginに […]