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

『Facebook Embed』ウィジェットのEmbedとは、『埋め込む』という意味です。
つまり、Facebookの投稿などをそのままサイトに埋め込み表示させることができます。
Facebook EmbedウィジェットはElementor Proのみに搭載されたています。
この記事ではFacebook Embedウィジェットの使い方を詳しく説明していきます。

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

Facebook Embedウィジェットの挿入

Facebook Embedウィジェットの挿入

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

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

こちらはFacebook Embedウィジェット挿入後の表示画面です。
デフォルトでElementor社のFacebookの投稿ページが表示されます。

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

サイト上でこのFacebook Embedウィジェットと自分のFacebookをリンクさせるには、まずWordPress内の設定にFacebookのApp IDを入力し、サイトとFacebookを紐付けする作業をしなくてはなりません。
編集タブの一番上に『Set your Facebook App ID in the Integrations Settings』(連携設定でFacebook App IDを設定する)とありますので『Integrations Settings』をクリックします。

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

タイプ・Post

タイプの説明

『タイプ』はFacebookページの投稿のタイプを以下から選択します。

  • Post(投稿)
  • 動画
  • コメント

※デフォルトは『Post』に設定されています。

URL

PostのURL設定

『URL』には表示させたいFacebookのURLをテキストバーに入力します。
つまりデフォルトですでに入力されているURLは、この現在表示されているPost(投稿)ページのURLが入力されているということです。

Full Post

Full Postの説明

『Full Post』は投稿の文章を全文表示させるかさせないかの設定です。
デフォルトでは『いいえ』に設定されているので投稿文がある一定のところで切れて『…See More』(続きを読む)と表示されています。
Full Postを『はい』に設定すると『…See More』の表示がなくなり、全文表示されるようになります。

タイプ・動画

タイプ・動画

『タイプ』を『動画』に設定すると上記の様な表示画面になります。

URL

動画のURL設定

『URL』には既にデフォルトでElementor社の動画のURLが挿入されている為上記の動画が表示されます。
Facebookで公開している動画のFacebook独自のURLをこちらに入力すればその動画を表示させることができます。

Full Post

Full Postを『いいえ』に設定した時の表示画面

『Full Post』を『いいえ』にすると動画の下部に表示されていた文章・いいね数・コメント数・シェア数の表示がなkなります。
※デフォルトは『はい』に設定されています。

Allow Full Screen

Allow Full Screenの説明(いいえ・デフォルト)

『Alloe Full Screen』は、動画の全画面表示を許可するかどうかの選択になります。
デフォルトではAllow Full Screenは『いいえ』に設定されており、上記の動画を再生させてみると、画面右下には各種設定が表示されますが、全画面表示を示すマークはありません。
つまり、表示されている動画のサイズはこれで固定のままということです。

Allow Full Postを『はい』にした時の表示画面

『Allow Full Screen』を『はい』にすると、動画の画面右下に全画面表示を表すマークが表示されます。

自動再生

自動再生の説明

『自動再生』を『はい』に設定すると動画は表示されたと同時に自動再生が始まります。
そして自動再生の場合はデフォルトの状態でサウンドがOFFになります。

Captions

Captionsの説明

『Captions』を『はい』に設定するとキャプションが入っている動画であればそのキャプションもサイトの画面上にも表示されます。
※デフォルトでは『いいえ』に設定されています。

タイプ・コメント

タイプ・コメント

上記は『タイプ』を『コメント』に設定した時の表示画面です。
コメントはその名の通り、誰かのコメントを抜粋して表示させることができます。

URL

コメントのURL設定

『URL』は既に表示されているコメントのURLがデフォルトで入力されています。
表示させたいコメントの URLをテキストバーに入力をすればそのコメントがサイト画面に表示されます。

Parent Comment

Parent Commentの説明

『Parent Comment』を『はい』に設定すると表示されているコメントに親(本元のFacebookアカウント所持者)の返信も表示される様になります。
※デフォルトでは『いいえ』に設定されています。


『Facebook Embed』ウィジェットは、サイト上でFacebookページの表示ができるので、商売などでFacebookページの認知をより上げたい時に活躍しそうなウィジェットですね!
表示タイプも Post ・動画・コメントとバリエーションも豊富です。
ぜひ、Facebook Embedウィジェットを活用してみてはいかがでしょうか!

コード書かないウェブ制作を学べるサロン『TOFUラボ』

目次

コメントを残す

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

そのElementorの質問
実際に使ってる人に聞いてみませんか?

TOFUラボはElementorを使う人が集まるサロンです。
メンバーは170人を超えます。