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

電話番号:06-6484-5445

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

  1. FacebookのLike Box(ライクボックス)をリウムスマイル!のホームページに設置する方法

FacebookのLike Box(ライクボックス)をリウムスマイル!のホームページに設置する方法

2012/05/30

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

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

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

 

「Page Plugin」の貼り付け方はこちらをご覧ください。

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

 

「Like Box」とは、当サイトの右側のメニュー欄に表示されている、
Webサイトなどの外部サイトでFacebookページを表示できる機能です。
Facebookページのウォール記事や「いいね」をクリックしてくれた方などが表示されます。

Facebookページを作成していないとできない機能です。
※Facebookの仕様により、個人ページでの利用はできません。

(2014/04/07修正)

 

 

 

Like Boxの設置方法のながれ

  1. Like Boxのコードを取得する
  2. Like Boxを表示するフリーページを作成する

 

 

1.Like Boxのコードを取得する

Like Boxページにアクセスする

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

http://developers.facebook.com/docs/reference/plugins/like-box/

 

 

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

1.Facebook Page URL
作成したFacebookページのURLを記入してください。

2.Width
LikeBoxの横幅を設定します。
トップページに表示させる場合は「745」、サイドに表示させる場合は「200」を推奨しております

3.Height
LikeBoxの縦幅を設定します。

4.Color Scheme
LikeBoxの背景の色を「light」か「dark」の2種類から選択します。
デザインテンプレートで黒い背景のものなどを選んでいない限り、「light」を推奨します。

5.Show Faces
「いいね」をクリックしてくれたユーザーのプロフィール写真の表示・非表示を選択します。

6.Show Header
Like Boxの一番上のエリア、青い背景に白文字で「Facebookもチェック」と書かれている箇所の表示・非表示を選択できます。

7.Show Posts
Facebookページのウォール記事が新着順に表示されます。チェックを外すと表示されなくなります。

8.Show Boder
Like Boxのボーダーの表示・非表示を設定します。

 

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

 

 

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

  1. プラグインコードが表示されますので、上部に並んでいるボタンの右端の「IFRAME」をクリックします。
  2. 画面に表示されたコードを全て右クリックでコピーします。

 

 

 

2.Like Boxを表示するフリーページを作成する

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

 

 

フリーページを新規作成する

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

 

  1. タイトルに任意のタイトルを記入します
  2. 本文のツールバーの上級者ツールバーへ切り替え(右から2番目のスパナボタン)」をクリックします

 

 

ソースコードを貼り付ける

  1. 枠の中に先ほどコピーしたコードを貼り付けます
  2. 「HTMLソース編集」をクリックします

 

内容エリアにライクボックスが表示されましたら、ページ下部の「保存」をクリック

 

 

 

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

 

以上でLike Boxをフリーページに設置することができます。

あとはご自身が表示させたい箇所にページを表示させたら完成です。