FacebookのPage Pluginを掲載する

ホームページにFacebookのページプラグインを掲載する方法をご案内します。

Facebookは、他社が運営するサービスです。そのため、予告なく仕様や操作手順が変更となる場合があります。ご利用の際には、Facebookが提供している最新情報ページやヘルプページなどをご確認ください。

以下の情報は、2016年6月現在の情報です。

FacebookのPage Plugin(ページプラグイン)とは

ホームページに、所有のFacebookページを表示させて、紹介する機能です。

ページプラグイン

 

操作手順
  • ホームページ更新画面で、設定したいページを開いておきます。

1)以下のURLをクリックして、Facebookのページプラグインのサイトを開きます

https://developers.facebook.com/docs/plugins/page-plugin
(2016年6月現在の情報です。)

2)表示項目を入力して、「コードの取得」をクリックします

(1)FacebookページのURL:FacabookページのURLを入力します。
(2):180 ※半角数字で入力(サイド狭めの場合180/サイド広めの場合230)
(3)高さ:任意 ※半角数字で入力

注意!ページプラグインを表示できるのは、商用のFacebookページのみです。

Facebookページ(商用。本名以外のサービス名も登録可)→掲載可

例) https://www.facebook.com/yamada

個人ページ(本名のみ登録可)             →掲載不可
     例) https://www.facebook.com/tarou.yamada

個人ページはURL欄(1)に、facebookのURLを入れて、下にイメージ画像が表示されません。

3)「コードの取得」をクリックし、「IFrame」を選択します。

→表示されたコードをコピーします。

4)ホームページ更新画面を開き、サイドエリアに「HTML部品」を追加して、右パネルを表示させます

部品を追加する

サイドエリアにに共通部品としてする場合、「部品の追加」をクリック>[共通部品も表示]、[ヘッダー・サイド・フッターエリアにも追加]をクリックします。

サイド部品>HTMLより、HTML部品を追加します。

5)HTML入力欄に、上記3の「コードの取得」画面でコピーしたコードを貼り付けます。

6)入力欄以外をクリックし、確定します

手順は以上です。

  • 更新した内容をホームページに反映させるには、左パネルで、更新したページの[更新]ボタンをクリックします。

編集エリアでは、Facebookの表示が確認できません。公開中のページでFacebookの表示をご確認ください。

横幅のサイズを調整する場合、HTML入力欄の「data-width="260"」の数値を半角で書き換えて、調整してください。

マニュアル更新情報

2018年8月30日

新機能の追加に伴い、下記のページを追加いたしました。
・書体を変更する

2018年7月2日

新機能の追加に伴い、下記のページを追加いたしました。
共通部品を一部のページのみ非表示にする

2018年7月2日

よくあるご質問ページの「部品・要素の編集について」を更新いたしました。

各種ダウンロード資料

ホームページ更新画面の
基本操作(印刷版PDF資料)

A4カラー印刷用

印刷版PDFはこちらをクリック