Elementor Pro『Facebook Page』ウィジェットの使い方

『Facebook Page』ウィジェットは、Facebookのページ、つまりヘッダーやカバーフォト、投稿を含めたFacebookのページ全体を表示させることのできるウィジェットです。

この記事では、Elementor Proにのみ搭載された Facebook Pageウィジェットの使い方を詳しく説明していきます。

Elementorのことをもっと学びたい人は、どうぞElementorの使い方完全ガイドを見てください。
様々なElementorに関する情報がまとめられています。

Elementor Pro『Facebook Page』ウィジェットの使い方を動画でご覧になりたい方はこちらからどうぞ!

Facebook Pageウィジェットの挿入

Facebook Pageウィジェットの挿入

『Facebook Page』ウィジェットをドラッグ&ドロップでカラムに挿入します。

Facebook Pageウィジェット挿入後の表示画面

こちらはFacebook Pageウィジェット挿入後の表示画面です。

Facebook App IDをサイトに紐付けする

サイト上でこのFacebook PageウィジェットとFacebookをリンクさせるには、まずWordPress内の設定にFacebookのApp IDを入力し、サイトとFacebookを紐付けする作業をしなくてはなりません。

編集タブの一番上に『Set your Facebook App ID in the Integrations Settings』(連携設定でFacebook App IDを設定する)とありますので『Integrations Settings』をクリックします。

この一連の説明は【Elementor Pro『Facebookボタン』ウィジェットの使い方】の記事の同セクションで説明をしていることと全く同じですのでそちらを参考にしてください。

リンク

 リンクの説明

リンクにはデフォルトでElementor社のFacebookページの URLが記載されているため Elementor社のFacebookページが表示されています。

TOYOTAのFacebookページ

こちらはTOYOTAのFacebookページです。
例えばこちらのURLをコピーし、Linkに貼り付けると…

TOYOTAのFacebookページのリンク挿入後の表示画面

TOYOTAのFacebookページが上記画面の様に表示されます。

レイアウト

レイアウトの説明

『レイアウト』ではデフォルトで既に『Timeline』が入っています。
TimelineとはこのFacebookページの投稿の部分です。
レイアウトでは以下のオプションを追加・削除が可能です。

  • Timeline(デフォルト)
  • Events
  • Messages

Events

レイアウト・Eventの説明

レイアウトに『Events』を追加するとFacebookページの画面上記の様にTimelineの右横にEventsというカテゴリーが追加されます。

Message

レイアウト・Messageの説明

レイアウトに『Message』を追加するとFacebookページ画面上のTimeline、Eventsに並んで『Message』の項目も追加されます。
表示させているFacebookページと閲覧者(個人)がメッセージ機能を使ってやり取りをしている場合は、Messageをクリックするとそのメッセージが表示される仕組みです。

Small Header

Small Headerの説明

『Small Header』はデフォルトでは『いいえ』に設定されていますが、『はい』に設定すると上記画面右側の様にヘッダー部分の画像が小さくなります。

Cover Photo

Cover Photoの説明

『Cover Photo』はデフォルトでは『はい』に設定されていますが『いいえ』にすると上記画面右側の様にヘッダー部分の画像がなくなります。

Profile Photos

Profile Photosの説明

『Profile Photos』は表示中のFacebookページに『いいね』をした人のプロフィール写真がFacebook ページのかバーフォト上の『Like Page』の右横に表示されます。
『いいね』を選択すれば、プロフィール写真の表示はなくなります。

Custom CTA Button

Custom CTA Buttonの説明

『Custom CTA Button』はデフォルトでは『はい』に設定されていますが『いいえ』にするとカバーフォトの右下に『Share』ボタンが追加されます。

高さ

高さの説明

『高さ』はFacebookページの高さを最小70から最大1000の値の範囲で変更することが可能です。
※デフォルトの高さの値は『500』に設定されています。


Facebook Pageウィジェットは、Timelineやヘッダー、カバーフォトのなどFacebookページの全貌が表示させられるウィジェットです。
Facebookページ自体を閲覧者に宣伝したい時にはうってつけのウィジェットですね!
このFacebook Pageウィジェットの他にもFacebookと関連したウィジェットに

がありあますのでサイトにFacebookの埋め込みを検討している方は是非参考にしてくださいね!

Naomi Suzuki

このサイトを運営してるナオミです。エンジニア歴13年、海外在住歴20年。
WordPressの情報やハッキングを防ぐ脆弱性の情報と自分の海外での生活の一部を無料のメルマガで配信しています。

目次

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

Elementorの無料ウェブサイトテンプレート
新規追加されました。

WordPressの最新情報が
毎週届く無料メールマガジン

DiviやElementorの情報だけでなく、脆弱性が見つかったプラグインやテーマのリストも毎週届きます。セキュリティの強化につながります。 

管理人のナオミが書くメルマガ
海外でエンジニア歴10年以上
DiviとElementorに精通