ホームページ制作、SEO対策 サイバーアクセル・アドバイザーズTOP » ブログ » webコラム» Facebookページをホームページに簡単に埋め込む方法
投稿日: 2016/10/29 投稿者:webコラム
お店や企業を知ってもらうという意味で
SNSを活用することは、もう当たり前の時代になってきています。
マーケティング活動におけるSNSツールで代表的なサービスは、
「Facebook」「Information」「Twitter」などがあります。
前回までは「Instagram」の埋め込み方法をご紹介してきましたが
今回は、Facebookの「Facebookページ」をホームページに埋め込む方法を
ご紹介していきます。
Facebookのプラグイン「Page Plugin」を利用します。
Facebookの内容を自分のホームページやブログに簡単に表示させることができ、
お店のFacebookページの存在はもちろん、コンテンツ発信を認知させたり、
「ファン」や「いいね!」を促すことができます。
ホームページで、このようなものを見たことあるのではないでしょうか。
Facebookのページプラグインにアクセスします。
・FacebookページのURL
表示させたいFacebookページのURLを入力します。
・タブ
タイムライン、イベント、メッセージの3種類のタブを表示することができます。
複数表示したい場合は、timeline,events,messagesのようにカンマで区切って入力します。
・幅
埋め込み時に表示させたい幅を180~500ピクセルの間で入力します。
・高さ
埋め込み時に表示させたい高さを入力します。(最低70ピクセル必要です。)
・表示オプション
スモールヘッダーを使用
プロフィール写真や背景画像の部分(ヘッダー)が小さくなります。
plugin containerの幅に合わせる
幅が可変するようなレスポンシブデザインの場合は、チェックを入れます。
カバー写真を非表示にする
プロフィールの背景画像を非表示にしてシンプルにします。
友達の顔を表示する
「いいね!」をしてくれた人のプロフィール写真が表示されます。
例として今回はこのように入力してみました。
「コードを取得」をクリックします。
設置方法としては2パターンの方法がありますので、
用途やお好みでお選びください。
【方法1(Javascript SDK)】
・ステップ2のコード
コードをコピーして、表示したいホームページのHTMLソース内の<body>タグの直後に貼り付けます。
・ステップ3のコード
コードをコピーして、ホームページの表示したいところ(HTMLソース内)に貼り付けます。
WordPressやブログに設置したい方は上記の2つのコードをひとまとめにして
ウィジットやプラグインに貼り付けてください。
【方法2(iFrame)】
手軽に設置したい場合はインラインフレームでの設置が簡単です。
「iFrame」タブをクリックするとコードが表示されますので、
コピーして表示したいところ(HTMLソース内)に貼り付けるだけです。
スマホなどで、Facebookページに投稿した内容が
ホームページやブログに埋め込んだFacebookページに連動して投稿されます。
ページプラグインの設置方法は簡単なので、
まだ埋め込んでいない方は是非チャレンジしてみてください。
Facebookページを有効活用してアクセスアップ・集客アップに繋げましょう!