スマホとPC両対応のホームページ作成、ご予約フォームの作成、
メルマガ配信、顧客管理機能までがまるっと一つになったリウムスマイル!

電話番号:06-6484-5445

営業時間:平日 9:00〜17:30

  1. FacebookのPage Plugin(ページプラグイン)をリウムスマイル!のホームページに設置する方法

FacebookのPage Plugin(ページプラグイン)をリウムスマイル!のホームページに設置する方法

※公式プラグイン「Like Box(ライクボックス)」は2015年6月23日に廃止されます。

※「Like Box」をお使いの方は、下記「Page Plugin」に差し替えていただきますようお願いいたします。

>>Facebook公式アナウンスはこちら(英語)

 

「Page Plugin」とは「Like Box」が仕様変更されたプラグインで、今まで通りWebサイトなどの外部サイトでFacebookページを表示できる機能です。

Facebookページのウォール記事や「いいね」をクリックしてくれた方などが表示されます。

また、ライクボックスの時と同じで、Facebookの仕様により個人ページでの利用はできません

 

 

 

 

Page Pluginの設置方法のながれ

  1. Page Pluginのコードを取得する
  2. Page Pluginを表示するフリーページを作成する
  3. 任意の場所にPage Pluginを表示させる

 

 

1.Page Pluginのコードを取得する

Page Pluginページにアクセスする

まず下記のアドレスをクリックして、Page Pluginページにアクセスします。

https://developers.facebook.com/docs/plugins/page-plugin

 

 

Page Pluginの設定をする以下の画像の解説を参考に各入力欄の項目を埋めていきます。

1.Facebook Page URL
作成したFacebookページのURLを記入してください。
※個人ページは利用できません。Facebookページを作成してください。
2.Tabs

初期状態では「timeline」が入力されているので、タイムラインが表示されるようになっています。

「events」を入力すればイベントが、「messages」を入力すればメッセージを送れる画面が表示されます。

また、文字を消すと何も表示されなくなります。

3.Width
何も設定しなくてもいい感じになりますので、いじらないでOK!
4.Height
何も設定しなくてもいい感じになりますので、いじらないでOK!
5.Use Small Header
Facebookページのヘッダー部分が少し小さくなります。シェアボタンなどが表示されなくなります。
6.Adapt to plugin container width
自動でウィジェットの幅を変更してくれる機能です。チェックは入れたままにしておいてください。
7.Hide Cover Photo
Facebookページのヘッダー写真の表示・非表示を選択します。
8.Show Friend's Faces
「いいね」をクリックしてくれたユーザーのプロフィール写真の表示・非表示を選択します。

すべての設定ができたら、「Get Code」をクリックします。

 

 

プラグインコードを取得する

  1. 「1」のコードをコピーしてメモ帳などに貼り付けます
  2. 「2」のコードをコピーして、先ほど貼り付けた「1」の下に貼り付けておきます

 

 

 

2.Page Pluginを表示するフリーページを作成する

リウムスマイル管理画面「ホームページ」−「ホームページパーツ一覧」

 

 

フリーページを新規作成して、コードを貼り付ける

フリーページの「フリーページの子パーツを追加(左から2番目の+ボタン)」をクリックします。

 

  1. タイトルに任意のタイトルを記入します
  2. 本文の灰色のツールバーにある「HTMLソース編集(メモと<>のアイコン)」をクリックします
  3. 枠の中に先ほどメモ帳にコピーした「1」と「2」のコードを貼り付けます
  4. 右下にある「HTMLソース編集」をクリック
  5. ページ下部の「保存」をクリック

 

 

3.任意の場所にPage Pluginを表示させる

表示させたい場所にパーツを追加します。
ここでは例として、メインエリア(エリア8)に表示する手順を説明します。
 
リウムスマイル管理画面 左上「プレビュー」

 

  1. エリア8にカーソルを合わせ、「+パーツ表示追加」をクリック

 

  1. 先ほど作成した「Facebook」ページをクリック

 

  1. 「タイトル」にチェックを入れます
  2. 「本文」にチェックを入れます
  3. ページ下部の「保存」をクリック

 

エリア8の一番下に追加されます。

 

 

公開ホームページで確認する

 

以上でPage Pluginをフリーページに設置完了です。