ソーシャルウォール 
フィード分析 
簡単な答え：Beaver BuilderにはYouTubeフィードモジュールはありません。動画のフィードを埋め込むには、Smash Balloon YouTube Feed Proでフィードを作成し、ショートコードをコピーして、Beaver Builderのテキストエディタモジュールに貼り付けてください。所要時間は約5分です。
動画は1つだけでいいですか？Beaver Builderに組み込まれた「Video」モジュールを使えば、YouTubeのURLを1つ埋め込むことができます。自動的に更新されるフィードを作成したい場合は、このプラグインをご利用ください。
以下に、私が実際に設定した手順を、各項目のスクリーンショットを交えて詳しく説明します。
Beaver BuilderにはYouTubeフィードモジュールがありません。そのため、多くの人は1回に1本の動画を挿入し、新しい動画を公開するたびにビルダー画面に戻って作業することになります。
自分のサイトでは、その作業にうんざりしてしまいました。今は「Smash Balloon YouTube Feed Pro」を使って、チャンネル全体を一度取り込めば、その後は自動的に最新の状態に保たれます。YouTubeに新しい動画が公開されると、自動的に私のサイトにも表示されるので、私が何もする必要はありません。
以下に、私が実際に実践している5つのステップを詳しく紹介します。また、Beaver Builder独自の「Video」モジュールの方が正直なところ優れたツールとなるケースについても説明します。
この記事の中で
Beaver BuilderにYouTube動画を追加する2つの方法
| Beaver Builderのビデオモジュール | ⭐ おすすめ：Smash Balloon YouTube Feed Pro | |
|---|---|---|
| 1本の動画ですか、それともチャンネル全体ですか？ | ❌ 1つずつ | ✅ チャンネル全体またはプレイリスト |
| 新しい動画を投稿すると、更新されますか？ | ❌ いいえ、手動で再埋め込みする必要があります | ✅ はい、単独で |
| そのテーマは、あなたのテーマに合うでしょうか？ | ⚠️ プレイヤーのスタイリングのみ | ✅ はい、テーマを引き継ぎます |
| レイアウトを選んでいただけますか？ | ❌ シングルプレイ専用 | ✅ グリッド、ギャラリー、リスト、カルーセル |
| YouTube APIキーは必要ですか？ | ✅ いいえ | ⚠️ はい、ほとんどのフィードタイプで可能です |
| 視聴者を他のチャンネルに流してしまうのでしょうか？ | ⚠️ はい、関連動画が表示されます | ✅ いいえ、表示されるのはあなたの動画だけです |
| 控えめな背景ヘッダーとして機能しますか？ | ✅ はい | ❌ いいえ、別の仕事です |
| 最適 | 1つのランディングページに1本の解説動画 | 定期的に記事を公開しており、フィードを自動的に更新したいサイト |
販売ページに動画を1つだけ掲載する場合は、「Video」モジュールを使用し、プラグインは使わずに済ませてください。このモジュールはビルダーに標準で搭載されており、その役割を十分に果たしてくれます。
動画が次々とアップロードされる場合、このプラグインの真価が発揮されます。フィードを一度設定しておけば、Beaver Builderを再度開くことなく、新しい動画がアップロードされるたびにサイトに表示されます。「関連動画」の行も重要です。通常の埋め込み方法では、動画が終了した瞬間に視聴者が競合他社のチャンネルに直接移動してしまう可能性があるからです。
「Smash Balloon YouTube Feed Pro」を入手する
ビーバービルダーでYouTubeを埋め込むための最良の方法
率直に申し上げますと、私はSmash Balloonに勤務しているため、当然ながら自社のプラグインをおすすめすることになります。だからこそ、上記の比較表ではBeaver Builderの標準モジュールにふさわしい評価を与え、また、このプラグインが「手間がかかる割にメリットが少ない」点についても正直にお伝えするつもりです。
私が使っているツールは「Smash Balloon YouTube Feed Pro」です。動画を1つずつ埋め込む代わりに、チャンネルを一度連携するだけで、プラグインが自動的に更新されるフィードを作成してくれます。
まさか気になるとは思わなかった点：フィードは、私のテーマのフォントや色を自動的に引き継いでいる。私はこれについてCSSを1行も書いたことがない。
Smash Balloonは、ウェブサイト運営者が実際のソーシャルコンテンツを信頼の指標へと転換し、信頼性とコンバージョン率を向上させることを支援します。ライブ動画フィードは、単一の埋め込みプレイヤーでは実現できない方法で、それを実現します。
このプラグインを使えば、WordPressサイトにYouTube動画を追加するのがこれまで以上に簡単になります。コーディングは一切必要ありません。
YouTube動画のフィードを表示し、訪問者はサムネイルをクリックして興味のある動画の全文を見ることができます。
さらに、YouTube Feed ProはBeaver Builderや、Elementor、SeedProd、DiviなどのWordPressページビルダープラグインと完璧に連動します。
実際、あなたが埋め込むすべてのYouTube動画フィードは、WordPressテーマのデザインをコピーし、箱から出してすぐに美しく見えます。
さらに、YouTube Feed Proには、あなたのウェブサイトをパワーアップさせる便利な機能が満載です：
- YouTube動画のフィードを簡単に作成、カスタマイズ、埋め込むには、シンプルな3ステップのガイドフローに従うだけです。
- このプラグインを使えば、YouTubeチャンネル、ライブストリーム、プレイリスト、検索結果、単一の動画投稿を埋め込むことができる。
- YouTube Feed Proにはスマート読み込み機能が搭載されているため、動画をいくつでも追加できます
- あらかじめ用意されたテンプレートをインポートし、ビジュアルカスタマイザーを使用することで、ユニークなデザインの美しいYouTube動画フィードを作成できます。
- すべてのYouTube動画フィードは100％レスポンシブで、携帯電話やタブレットを使用している訪問者に完璧に読み込まれます。
一番の魅力は？YouTube Feed Proには、WordPressの達人による専任のサポートチームが付属しており、いつでも手を貸してくれます。
このように、YouTube Feed Proは、YouTubeをあなたのウェブサイトに統合し、あなたのブランドを向上させるために必要なすべての機能と特徴を備えています。
実際、YouTube Feed Proは、市場で最も優れたソーシャルメディアフィードプラグインを開発したチームによって作られた。
Beaver Builder に YouTube 動画を埋め込む準備はできましたか？今すぐ YouTube Feed Pro を入手してください！
それではBeaver Builderのチュートリアルを始めましょう。
ビーバービルダーのウェブサイトにYouTubeの動画を埋め込む方法
この機能はすべて、1つのショートコードで動作します。「Smash Balloon YouTube Feed Pro」をインストールし、フィードを作成してAPIキーでチャンネルと連携させ、ビジュアルカスタマイザーでスタイルを設定した後、そのショートコードをBeaver Builderのテキストエディタモジュールに貼り付けるだけです。
所要時間は約5分です。その大半はAPIキーの生成に費やされます。
ステップ 1: Smash Balloon YouTube Feed Pro をインストールする
さあ、始めましょうか？ まずは、こちらから「YouTube Feed Pro」を入手し、インストールして有効化してください。
プラグインをインストールする方法については、WordPressのチュートリアルを参照してください。
たとえ動画が1本しか必要ないサイトであっても、私はこのプラグインをインストールしたままにしています。というのも、クライアントから「すべての動画を1つのページにまとめてほしい」と依頼されたときに、ショートコードがすでに用意されているようにしておくためです。
ステップ2：YouTube動画フィードを作成する
プラグインの準備ができたら、WordPressのダッシュボードエリアからYouTube Feed " All Feedsメニューを開きます。
次に、新規追加をクリックして、プラグインのガイドフローを開始する。
そうすると、プラグインがYouTubeフィードのタイプを選択するように尋ねます。6つのオプションから選ぶことができます：
- チャンネル
- プレイリスト
- お気に入り
- 検索
- ライブストリーム
- シングルビデオ
このガイドでは、チャンネル・フィード・タイプにした。
YouTube動画フィードの種類を選択したら、「次へ」ボタンをクリックします。
実際の公開方法に合ったフィードの種類を選んでください。「チャンネル」は、動画を1つずつ選択しなくても、新しい投稿をすべて自動的に取り込んでくれるため、ほとんどの人にとって適しています。
ステップ3：YouTubeアカウントに接続する
フィードを作成したら、YouTubeアカウントに接続しましょう。こうすることで、YouTube Feed Proが自動的に動画を取得し、ウェブサイトに表示することができます。
そのためには、YouTube API Keyを入力するのが最も簡単な方法です。
APIキーをまだお持ちでない方のために、YouTube APIキーの作成方法について初心者向けのチュートリアルをご用意しました。
キーを取得したら、ウェブサイトに戻り、ここでAPIキーの追加 ボタンを選択します。
最後に、YouTube APIキーをポップアップに貼り付け 、Addボタンをクリックして進みます。
その後、YouTubeのビデオフィードに使用するソースを入力します。
このソースは基本的に、ビーバービルダーのサイトに表示したいYouTubeチャンネル、プレイリスト、検索語などです。
例えば、このガイドでは、WPbeginnerYouTubeチャンネルからのビデオを埋め込みます。
そこで、単純にYouTubeチャンネルを開き、リンクの最後にあるチャンネルIDを コピーした。
このようにソースをコピーしたら、ウェブサイトに戻る。ここで、コピーしたテキストをポップアップのチャンネルIDまたはユーザー名フィールドにペーストする。
Nextボタンをクリックして次に進みます。
可能であれば、「クイック接続」ボタンを使用するのではなく、APIキーを取得してください。そうすることで、YouTubeフィードがより頻繁に更新されるようになります。
ステップ4：YouTube動画をカスタマイズする
ソースを接続した後は、YouTube Feed Proが残りを処理し、あなたのサイトを見るビデオフィードを自動的に作成します。
さらに、あらかじめデザインされたテンプレートを動画に埋め込むこともできる：
- デフォルト
- カルーセル
- カード
- リスト
- ギャラリー
- 最新ビデオ
- ショーケース・カルーセル
- ウィジェット
気に入ったテンプレートを選び、「次へ」ボタンをクリックして次に進む。
ビジュアルカスタマイザーでYouTubeビデオが開きます。
左側のオプションで、レイアウト、カラースキーム、ヘッダーデザイン、ビデオスタイルなどを変更できます。
さらに、右側のライブ・プレビューで変更をリアルタイムで確認できるので、カスタマイズがより簡単で正確になります。
まず、Beaver Builderサイトの動画のレイアウトを変更してみましょう。
フィードレイアウトオプションをクリックして、それを開始する。
このプラグインを使えば、YouTube動画のレイアウトを4種類から選べるようになります：
- グリッド：一度に大量のビデオを整然とした行と列で表示する。
- ギャラリー：1つの動画を目立つように表示し、その下に他のサムネイルを表示します。
- リスト動画を一列に表示することで、各動画の表示領域を広くすることができます。
- カルーセル： ビデオフィードをインタラクティブなスライドショーのカルーセルに変える
レイアウトに満足したら、Saveボタンをクリックして変更を保存します。
その後、「カスタマイズ」をクリックすれば、以前のカスタマイズ・オプションに戻ることができます。
次に、YouTube動画の上に表示されるヘッダーを変更してみよう。
左側のヘッダーオプションを選択することで可能です。
左上には、ヘッダーを有効または無効にするオプションがあります。
その下で、2種類のヘッダーを選ぶことができる：
- 標準：チャンネルアイコン、名前、説明などを表示する
- テキスト フィードの上に表示する見出しを書く
標準ヘッダーを選択した場合、チャンネル説明と 購読者数の有効・無効を選択できます。
前回同様、Saveをクリックして新しいヘッダーを保存します。
ご覧のように、ビジュアルカスタマイザーは、あなたの配色、より多くのボタンの読み込み、ビデオの数などを変更する簡単な方法を提供します。YouTube動画フィードに満足したら、もう一度保存をクリックしてください。
スタイリングはBeaver Builder内ではなく、ここで行ってください。フィードはすでにテーマの設定を継承しているため、ビルダーで上書きした設定は、フィードを埋め込むすべてのページで繰り返し作業を行うことになってしまいます。
ステップ 5: Beaver BuilderにYouTube動画を埋め込む
Beaver BuilderサイトにYouTube動画を追加する準備はできましたか？
まず、上部にある埋め込み ボタンをクリックします。
次に、YouTubeの動画フィードを埋め込む方法がすべて表示されます。ページに埋め込むことも、サイドバーに追加することも、フッターにフィードを表示することもできます。
とりあえず、コピーボタンをクリックしてショートコードを保存してください。
次に、Beaver Builderで新しいページを作成して動画を埋め込みます。
ダッシュボードからPages " Add New メニューを開き、Launch Beaver Builder をクリックするだけです。
これでBeaver Builderプラグインのドラッグアンドドロップエディタでページが開き、右側にさまざまなコンテンツモジュールが表示されます。
左側には、現在作業中のランディングページのライブプレビューが表示されます。
ショートコードを貼り付ける前に、まず右側にあるテキストエディタモジュールを探してください。
次に、このモジュールを左側のウェブページにドロップします。
そうすると Beaver Builder がこのモジュールの追加オプションを開きます。
最後に、ショートコードをフィールドに貼り付け、「保存」をクリックする。
これだけで、YouTube Feed Pro が自動的に動画フィードを Beaver Builder サイトに追加します。上部の完了ボタンをクリックし、公開オプションを選択します。
正常に動作するようになったら、その行をBeaver Builderのテンプレートとして保存してください。このテンプレートを再利用しているすべてのページは同じフィードを参照しているため、後でフィードを編集すると、それらすべてのページが一度に更新されます。
Beaver BuilderでYouTube動画のヘッダーを追加するにはどうすればよいですか？
動画ヘッダーは、埋め込み動画とは別のものです。そのため、上記の手順では動画ヘッダーは作成されません。ヘッダーとは、テキストの背後で行の背景として再生される動画のことであり、ユーザーがクリックできるプレイヤーではありません。
設定するには：
- 行にカーソルを合わせ、レンチアイコンをクリックして「行の設定」を開きます
- [スタイル] タブを開き、「背景」までスクロールします
- 背景の種類を「動画」に変更する
- 「ソース」フィールドを「YouTube」に設定し、動画のURLを貼り付けてください
Beaver Builder は、ここにあるメディアライブラリから MP4 および WebM ファイルを読み込むほか、自動再生をブロックするブラウザ向けに代替画像も読み込みます。
導入前に知っておくべきこと：背景動画はあくまで装飾です。音声はミュートされた状態でループ再生され、誰も一時停止したり別の動画に切り替えたりすることはできません。また、ファイルサイズが大きいとページの読み込み速度に悪影響を及ぼします。Beaver Builderの公式ガイドラインでは、背景動画は短く、音声をミュートし、高度に圧縮しておくよう推奨されています。
ですから、訪問者に実際に動画を視聴してもらいたいなら、フィードを活用しましょう。ヒーロー見出しの背後に動きを出したい場合は、行の背景設定が最適です。
Beaver Builder サイトに、自動更新される YouTube フィードを追加しましょう
チャンネルを一度連携するだけで、新しい動画が自動的に表示されます。再埋め込みやショートコードの編集は不要です。
YouTubeのフィードを作成するBeaver BuilderサイトでYouTube動画を埋め込むことで、どのように信頼を築くか
実際の動画が掲載されたページは、初めて訪問した人にとって、自社の活動内容を説明するページとは印象が異なります。ライブフィードによって次のような変化が生じます：
- 初めてサイトを訪れた人には、「約束」ではなく「実証」が提示されます。あなたのことをまったく知らない人でも、あなたが自社の製品について説明する様子を見ることができます。これは、どんなに長い説明文よりも、信頼を得るための近道なのです。
- 訪問者の滞在時間が長くなると、検索エンジンもそれを認識します。2本の動画を視聴する訪問者は、検索結果ページに戻らない訪問者です。その結果、SEO効果も向上します。
- YouTubeチャンネルは、ウェブサイトのアクセス数を原動力として成長していきます。サイト上で動画を視聴する訪問者は、クリックひとつでチャンネル登録できるため、すでに獲得している視聴者が、これから築き上げようとしている視聴者層の基盤となるのです。
- 動画によるお客様の声は、本来なら自らが行わなければならない営業活動を代行してくれます。カメラの前で顧客が語る言葉は、テキストの引用文で同じ内容を伝えるよりもはるかに効果的です。
- メンテナンスをしなくて済むんです。これは私が過小評価していた点です。フィードは自動的に更新されるため、一度も気にかけることなく、1年後もサイト上の動画は最新の状態のままです。
Beaver Builder に関する YouTube の質問
Beaver BuilderにはYouTubeモジュールはありますか？
フィードモジュールではありません。Beaver Builderには、YouTubeまたはVimeoの動画を1つずつ埋め込むことができる「動画モジュール」が付属しており、ポスター画像、自動再生、ループ再生、ライトボックス再生などの機能を備えています。複数の動画を自動的に更新するフィードを表示するには、プラグインが必要です。
プラグインを使わずに、Beaver Builder に YouTube 動画を埋め込むにはどうすればよいですか？
「動画」モジュールをページにドラッグ＆ドロップし、「動画タイプ」を 「埋め込み」に設定して、YouTubeのURLを貼り付けます。所要時間は約30秒です。ただし、注意すべき点は、これが単一の動画であるため更新されず、再生終了時にYouTubeの「関連動画」欄が表示されると、訪問者が他のチャンネルに誘導されてしまう可能性があるということです。
これを行うには、YouTube APIキーが必要ですか？
Beaver Builder独自のビデオモジュールについては、必要ありません。Smash Balloonの「YouTube Feed Pro」フィードについては、ほとんどのフィードタイプで必要となります。これは、YouTubeが共有されたSmash Balloonアプリから1日あたりに送信できるリクエスト数に制限を設けているためです。独自のキーを作成するには数分程度かかりますが、これにより、アクセスが集中する日でもフィードが正常に動作し続けます。
チャンネルだけでなく、プレイリストやライブ配信も埋め込むことはできますか？
はい。「Smash Balloon YouTube Feed Pro」には、「チャンネル」、「プレイリスト」、「お気に入り」、「検索」、「ライブ配信」、「単体の動画」の6種類のフィードがあります。いずれも、テキストエディタモジュールにショートコードを貼り付けるという同じ方法で、Beaver Builderに埋め込むことができます。
Beaver Builderのエディタ内でフィードが表示されないのはなぜですか？
ショートコードの出力が、ビルダーのプレビューペインに常に表示されるとは限りません。何かが正常に機能していないと決めつける前に、「完了」をクリックして、公開されたページをプレビューしてください。それでも表示されない場合は、そのショートコードがショートコードを処理しないモジュールに配置されている可能性が高いです。
今すぐYouTube動画の埋め込みを始めましょう
設定はこれだけです。テキストエディタモジュールにショートコードを1つ挿入するだけで、Beaver Builderのサイトに、常に最新の状態に更新される動画フィードが表示されます。
もし1つのページに動画を1つだけ掲載すればよいのであれば、Beaver Builderの「Video」モジュールだけで十分ですし、それをやめるよう説得するつもりもありません。しかし、定期的に記事を公開しているなら、手作業で動画を再埋め込む手間を省き、二度とそのことを考えなくて済むようになるだけで、5分かける価値は十分にあります。
「Smash Balloon YouTube Feed Pro」を入手する
