要約:WordPressにFacebook動画を埋め込む方法
Facebook動画をWordPressサイトに掲載する実際的な方法は4つあります。最適な方法は、無料、デザイン重視、自動更新、プラグイン不要のいずれを求めているかによって異なります。
- SeedProdメソッド:SeedProdビルダーのページにFacebook動画埋め込みブロックをドロップして、デザインを完全に制御します。
- フィードプラグインメソッド:Facebookフィードプラグインを使用して、自動更新される多数の動画やライブストリームを表示します。
- 手動iframeメソッド:カスタムHTMLブロックにFacebookの埋め込みコードを貼り付けて、プラグインなしで1つの動画を掲載します。
- ネイティブ埋め込みブロック:まずWordPressの無料埋め込みブロックを試してください。表示されない場合は、iframeをフォールバックとして使用します。
- ニーズで選ぶ:1つの動画ならネイティブまたは手動、デザイン重視ならSeedProd、自動更新ギャラリーならフィードプラグイン。
Facebookで好評な動画があり、それを自分のサイトにも掲載したいと考えているとします。レイアウトが崩れたり、ページ速度が低下したりしないか心配になります。
良いニュースは、WordPressにFacebook動画を無料または有料の4つの方法で埋め込めることです。このガイドでは、それぞれの方法を詳しく説明するので、あなたの動画、サイト、予算に合った方法を選ぶことができます。
適切な方法の選び方
それぞれの方法は異なる問題を解決するため、最も速く選ぶ方法は、あなたが何を達成しようとしているかに合わせることです。
| 方法 | 最適な対象 | プラグインが必要ですか? |
|---|---|---|
| ネイティブ埋め込みブロック | 簡単な動画1つ、無料、プラグインなし | いいえ |
| SeedProd | ページと動画の外観を完全に制御 | はい(SeedProd) |
| Facebookフィードプラグイン | 自動更新される多数の動画フィード | はい(Smash Balloon) |
| 手動iframeコード | 動画1つ、プラグインなし、基本的なスタイル設定 | いいえ |
WordPressにFacebook動画を埋め込むことはできますか?
はい、WordPressにFacebook動画を埋め込むことができます。埋め込みが訪問者に対して機能するには、動画が公開されている必要があります。
最も簡単な方法は、組み込みの動画プレーヤーを備えたWordPressプラグインを使用することです。このガイドの後半では、この目的に最適なWordPressプラグインを2つ紹介し、さらに無料のプラグインなしオプションも紹介します。
SeedProdを使用してWordPressにFacebook動画を埋め込む方法
SeedProdを使用すると、コードに触れることなく、Facebook動画を1つページにドロップし、その外観を正確に制御できます。これは、Facebook動画埋め込みブロックが組み込まれたドラッグ&ドロップWordPressウェブサイトビルダーです。
私は自分のサイトでSeedProdを使用しているため、動画を適切なページデザイン内に配置したい場合は、この方法を選択します。構築中に埋め込みがライブで機能するのを確認できるため、推測作業が大幅に省けます。

ステップ1. SeedProdのインストールと有効化
まず、WordPressサイトにSeedProdプラグインをインストールして有効化します。
このチュートリアルではSeedProdを使用しています。なぜなら、Facebook動画埋め込みブロックは、フィードやライブストリームもカバーするAdvanced Blocksパネルにあるからです。
ヘルプが必要な場合は、SeedProdのドキュメントにあるステップバイステップのインストールガイドに従ってください。
ステップ2.ランディングページまたはテーマテンプレートを選択
SeedProd を有効化したら、デザインの基盤として使用するテンプレートを選択する必要があります。SeedProd には、どちらも Facebook 動画埋め込みをサポートする 2 つのオプションがあります。
- テーマビルダー: 完全な WordPress ウェブサイトキットから始め、すべてのページとテンプレートをカスタマイズします。
- ランディングページビルダー: 既存の WordPress テーマと連携する単一のページを作成します。
このガイドでは、ランディングページビルダーを使用します。これは、ページに Facebook 動画を追加する最も簡単な方法だからです。WordPress のダッシュボードから、SeedProd » ランディングページ に移動し、新しいランディングページを追加 をクリックします。

ステップ 3. SeedProd ビルダーでテンプレートをカスタマイズする
次に、ページの目的に合ったテンプレートを選択します。SeedProd には、完全にカスタマイズ可能な数十個のプロフェッショナルにデザインされたテンプレートがあるので、希望するレイアウトに近いものを選択してください。

選択すると、テンプレートが SeedProd のドラッグ&ドロップビルダーで開きます。右側にページのライブプレビューが表示され、左側にコンテンツブロックと設定のパネルが表示されます。
プレビュー内の見出しや画像などの任意の要素をクリックして、テキスト、色、フォント、スペーシングを変更します。これらの簡単な編集は、Facebook動画の埋め込みを追加する前にブランドに合わせるのに役立ちます。

ステップ 4. WordPress で Facebook 動画埋め込みブロックを追加する
Facebook動画を埋め込む時間です。SeedProdビルダーで、左側の「高度なブロック」パネルを開き、「Facebook動画埋め込み」ブロックを動画を表示したい場所にドラッグします。

ブロックをクリックして設定を開きます。「動画リンク」フィールドにFacebook動画のURLを貼り付けると、ライブプレビューがすぐに表示されます。
より良い視聴体験のために、自動再生、フルスクリーン、キャプションなどのオプションを有効にできます。

このブロックは、単一の動画、ライブストリーム、動画プレイリストなど、あらゆる種類のFacebookコンテンツをサポートしているため、ページに合うものを埋め込むことができます。
ステップ 5. Facebook 動画ページを公開する
デザインに満足したら、SeedProd ビルダーのモバイルプレビューアイコンをクリックして、Facebook 動画ページがスマートフォンやタブレットで素晴らしく見えることを確認します。

フォントサイズやスペーシングなどを調整する必要がある場合は、モバイルビューを個別に編集できます。これにより、埋め込まれた動画がすべてのデバイスでスムーズに読み込まれ、再生されることが保証されます。

すべて準備ができたら、公開 をクリックします。

Facebook 動画ページが公開され、訪問者は WordPress サイトから直接動画を視聴、いいね、共有できるようになりました。


あなたも作成しませんか?
Facebook動画を、見た目が良いページにドロップしてください
SeedProdのドラッグ&ドロップビルダーを使用すると、動画を配置し、その周りのページをスタイル設定し、公開前にライブで動作を確認できます。コードは不要です。
ページを構築したい動画フィードプラグインを使用して WordPress に Facebook 動画を埋め込む方法
複数のFacebook動画や完全な動画フィードをWordPressサイトに表示したい場合は、プラグインが最善の選択肢です。Smash Balloonの「カスタムFacebookフィードプロ」は、最新のFacebook動画、プレイリスト、ライブストリームを自動的に取得するため、最良の選択肢です。
このプラグインを使用すると、WordPressサイトのどこにでもFacebook動画を埋め込むことができ、Facebookに新しいコンテンツを投稿するたびにフィードが自動的に更新されます。これはWordPressエコシステムでよく知っているツールであり、詳細を知りたい場合は、私の完全な「Smash Balloonレビュー」を読むことができます。

ステップ1. カスタムFacebookフィードProプラグインのインストールと有効化
開始するには、Smash BalloonのカスタムFacebookフィードプロプラグインをインストールしてアクティブ化します。WordPressダッシュボードから「プラグイン » 新規追加」に移動し、プラグインのzipファイルをアップロードして、「今すぐインストール」、次に「有効化」をクリックします。
次に、Facebookフィード » 設定に移動し、Smash Balloonライセンスキーを入力します。キーはSmash Balloonアカウントエリアで見つけることができます。

ステップ2. FacebookアカウントをWordPressに接続する
次に、プラグインが動画を取得できるようにFacebookアカウントを接続する必要があります。WordPressダッシュボードからFacebookフィード » すべてのフィードに移動し、新規追加をクリックします。

次の画面で、動画フィードタイプを選択し、次へをクリックします。次に、Facebookページまたはグループのどちらを接続したいかを選択します。

新規追加をクリックし、Facebookアカウントにログインして、要求された権限を付与します。これにより、プラグインはWordPressサイトに埋め込むための動画、プレイリスト、ライブストリームにアクセスできるようになります。

ステップ3. Facebook動画フィードのレイアウトを作成する
Facebookアカウントが接続されると、Smash Balloonから動画フィードのレイアウトを設定するように求められます。まず、リンクしたばかりのFacebookページまたはグループを選択し、次へをクリックします。

次に、フィードテーマとレイアウトスタイルを選択します。グリッド、カルーセル、マソンリー、または全幅動画フィードから選択できます。各オプションは完全にレスポンシブであり、任意のWordPressテーマで動作します。

特定のプレイリストから動画を表示したい場合は、続行する前にプレイリストのURLを貼り付けることができます。それ以外の場合は、フィードに選択したFacebookページまたはグループのすべての動画が含まれます。
ステップ4. Facebook動画をカスタマイズする
フィードレイアウトが設定されたら、サイトでのFacebook動画の外観をカスタマイズできます。フィードの横にある鉛筆アイコンをクリックして、Smash Balloonフィードエディターを開きます。

左側のパネルで、テンプレート、テーマ、配色、レイアウトの間隔を調整できます。その下では、ブランドに合わせてヘッダー、投稿の詳細、いいねボックス、ライトボックス設定などの要素を微調整できます。

変更はプレビューに即座に反映されるため、サイトに完全に一致するまでフィードを微調整できます。満足したら、保存をクリックして設定を保持します。

ステップ5. WordPressにFacebook動画を埋め込む
フィードの準備ができたら、WordPressサイトのどこにでも埋め込むことができます。Smash Balloonフィードエディターで、右上隅にある埋め込みボタンをクリックします。

3つのオプションが表示されます。ページに追加、ウィジェットエリアに追加、またはショートコードを使用します。サイトに最適な方法を選択してください。

フィードをページに埋め込むことを選択した場合は、リストからページを選択して「追加」をクリックできます。次に、WordPressブロックエディターを開き、カスタムFacebookフィードブロックを追加して、フィードをプレビューします。

サイドバーやフッターにフィードを追加することもできます。「外観 » ウィジェット」に移動し、カスタムFacebookフィードブロックをウィジェットエリアに追加して、「保存」をクリックします。

Facebookの動画フィードが公開されました。訪問者はWordPressサイトから直接動画を視聴、いいね、共有できます。
WordPressにFacebook動画を手動で埋め込む方法(プラグイン不要)
WordPressで単一のFacebook動画のみを埋め込む必要がある場合は、Facebookに組み込まれているiframe埋め込みコードを使用できます。この方法ではプラグインは必要ありませんが、カスタマイズオプションは少なく、新しい動画を公開しても更新されません。
注意点として、生のFacebook iframeは固定幅であり、自動的にレスポンシブではありません。モバイルレイアウトが重要な場合は、レスポンシブコンテナで囲むか、上記のSeedProdまたはプラグインの方法を使用してください。
ブログ記事やページで、一度きりの動画に最適です。同じ貼り付け方法は、標準動画だけでなく、Facebookリールにも機能します。
ステップ1. Facebook動画の埋め込みコードを取得する
まず、埋め込みたいFacebook動画を開きます。動画の下にある共有ボタンをクリックし、メニューから埋め込みオプションを選択します。

Facebookがiframeコードを生成します。コードを取得をクリックしてクリップボードにコピーします。これは、次のステップでWordPressの投稿またはページに貼り付けるコードです。

ステップ2. WordPressに埋め込みコードを貼り付ける
次に、Facebook動画を表示したいWordPressの投稿またはページを開きます。ブロックエディターで、動画を配置したい場所にカスタムHTMLブロックを追加します。

Facebookからコピーしたiframe埋め込みコードをHTMLブロックに貼り付けます。次に、プレビュータブをクリックして、動画がどのように表示されるかを確認します。

表示に満足したら、公開または更新をクリックして、動画をサイトで公開します。

ネイティブWordPress埋め込みブロックでFacebook動画を埋め込む方法(無料)
最も安価な方法は、WordPressに既に組み込まれている無料の埋め込みブロックです。プラグインもコードも不要です。投稿やページに動画を1つだけ追加したい場合は、まずこれを試す価値があります。
ブロックエディターで埋め込みブロックを追加し、公開されているFacebook動画のURLを1行に貼り付けてEnterキーを押します。WordPressは、そのリンクを自動的にプレーヤーに変換しようとします。

正直なところ、1つだけ注意点があります。WordPressはFacebook oEmbedを確実にホワイトリストに登録していないため、自動埋め込みが正しく表示されないことがよくあります。その場合は、上記の手動の方法によるカスタムHTML iframeがフォールバックとなります。
これがフィードプラグインとの本当の違いです。ネイティブブロックは一度に1つのリンクを処理し、スタイリングの制御はありませんが、Smash Balloonのようなプラグインは、自己更新されるデザインされたフィードを構築します。単一の埋め込みにより多くの制御が必要な場合は、WordPressに動画を埋め込む方法ガイドで、より広範なブロックオプションについても説明しています。
WordPressにFacebook動画を埋め込むことに関するFAQ
URLを貼り付けるだけでWordPressにFacebook動画を埋め込めますか?
時々。WordPressにはネイティブの埋め込みブロックがあるため、公開されているFacebook動画のURLを1行に貼り付けると、自動的にプレーヤーに変換される場合があります。ただし、Facebook oEmbedは確実にホワイトリストに登録されていないため、リンクがプレーンテキストのままの場合は、代わりにカスタムHTML iframeメソッドを使用してください。
埋め込みコードを貼り付けたのにFacebook動画が表示されないのはなぜですか?
最も一般的な原因はプライバシーです。動画とそれが属するページの両方が公開されている必要があります。ログイン中に表示されていても、訪問者には表示されません。
最も簡単なテストは、Facebookからログアウトした状態でプライベートウィンドウでページを開くことです。そこで動画が空白の場合は、公開設定にしてから再試行してください。また、エンゲージメントが直帰率を下げる可能性があるのはこのためです。実際に再生される動画は、人々をページに留めるからです。
WordPressにFacebookリールを埋め込むにはどうすればよいですか?
Facebookリールは、標準の動画と同じ方法で埋め込めます。リールのURLをSeedProd Facebook Video Embedブロックに貼り付けるか、リールの共有メニューからiframeコードを取得してカスタムHTMLブロックにドロップします。埋め込みを機能させるには、リールが公開されている必要があります。
Facebook動画を今日から埋め込みましょう
Facebookで好評だった動画を、レイアウトを壊したりページを遅くしたりすることなく、自分のサイトに掲載できるようになりました。無料のネイティブブロック、SeedProd、フィードプラグイン、または手動のiframeのいずれであっても、最適な方法を選択してください。
その他、役立つ可能性のあるチュートリアルはこちらです。
- FacebookページをWordPressに追加する方法
- FacebookイベントをWordPressに埋め込む方法
- ビジネスを成長させるためのFacebookプレゼント企画のアイデア
- 動画ランディングページを簡単に作成する方法
- WordPressにTwitterウィジェットを追加する方法
お読みいただきありがとうございます!ご意見をお聞かせいただければ幸いですので、ビジネスを成長させるための役立つアドバイスやコンテンツについては、お気軽にYouTube、X、Facebookで会話にご参加ください。
