Page Pluginを使ってWordPressにFacebookのタイムラインを表示させる方法

Page Pluginを使ってWordPressにFacebookのタイムラインを表示させる方法

今回は、WordPressのサイドバーにFacebookのタイムラインを埋め込む方法を解説します。

難しい設定やプラグインを設定する必要もなく簡単に設置することができますので、気になった方はぜひ試してみてください。
 
 

スポンサーリンク

WordPressにFacebookのタイムラインを埋め込む方法

ページプラグインからコードを取得する

まず、Facebookのページプラグインにアクセスします。

Facebookのページプラグイン
 
 
[FacebookページのURL]の欄にFacebookページのURLを入力すると、サイトに表示されるタイムラインがプレビューされます。

[FacebookページのURL]の欄にFacebookページのURLを入力
 
 
ここでは、以下の項目を設定してタイムラインをカスタマイズすることができます。
プレビューを見ながら自分好みに調整しましょう。
 
 

  • タブ
    「timeline」と入力すると、タイムラインが表示されます。
    空白にするとタイムラインが非表示になります。
  •  


  • タイムラインの幅を180〜500pxで指定できます。
  •  

  • 高さ
    タイムラインの高さを70px以上で指定できます。
  •  

  • スモールヘッダーを使用
    チェックを入れると、通常よりも高さの低いヘッダーが表示されます。
  •  

  • plugin containerの幅に合わせる
    チェックを入れると、サイドバーなどに埋め込んだ時に、表示枠の幅に収まるように自動でサイズ調整されます。
  •  

  • カバー写真を非表示にする
    チェックを入れると、カバー写真が非表示(白色)になります。
  •  

  • 友達の顔を表示する
    チェックを入れると、友達の顔が表示されるようになります。

 
 
タイムラインのカスタマイズが完了したら、『コードを取得』ボタンをクリックしましょう。

『コードを取得』ボタンをクリック
 
 
以下のような画面が表示されます。

2種類のコードが表示される
 
 
上の方のコードは、サイト内のbodyタグ内で1度だけ呼び出せばOKです。
タイムラインをページ内で何度も呼び出す場合でも、このコードを1回だけ記述しておけば大丈夫です。

下の方のコードは、タイムラインを表示させたいところに貼り付けます。

WordPressのサイドバーに埋め込む場合は、このどちらのコードもコピーしておく必要があります。
 
 

WordPressのウィジェットにコードを貼り付ける

WordPressの管理画面左メニューから『外観ウィジェット』という順にクリックして進みます。

『外観→ウィジェット』という順にクリック
 
 
ウィジェットの設定画面が開きます。
タイムラインを表示させたい場所にテキストウィジェットを設置し、内容に先ほどコピーした2種類のコードを貼り付けましょう。

コピーした2種類のコードを貼り付け
 
 
コードを貼り付けたら『保存』ボタンをクリックします。
 
 
これで、サイトにFacebookのタイムラインが表示されます。
きちんと表示されているか確認しておきましょう。

Facebookのタイムラインが埋め込まれたサイト
 
 

まとめ

今回は、WordPressのサイドバーにFacebookのタイムラインを埋め込む方法を解説しました。

サイトにFacebookのタイムラインを表示させることで、「いいね!」を押してもらえるきっかけを増やせるほか、「いいね!」してくれたユーザーにサイトの更新情報を随時知らせることができるようになります。

あなたのファンを増やしていくためにもとても重要な施策ですので、気になった方はぜひ挑戦してみてください。
 
 

スポンサーリンク








Page Pluginを使ってWordPressにFacebookのタイムラインを表示させる方法