訪問者に動画コンテンツで関心を引かせたいですか？それなら、ElementorサイトにYouTubeプレイリストを埋め込むのが効果的な戦略です。
エレメンターで美しいサイトを作成しているオーナーでも、滞在時間の低さに悩むケースを数多く見てきました。訪問者はページにアクセスすると素早くスクロールし、関与することなく離脱してしまうのです。
しかし、厳選されたYouTube動画のプレイリストを表示することが、訪問者をサイトに釘付けにする画期的な方法となった。
個々の動画ではなくプレイリスト全体を表示することで、Netflixのような体験が実現され、1本の動画が自動的に次の動画へと流れ込む。
訪問者はわずか2～3分ではなく、20～30分も滞在し、あなたのコンテンツが価値あるものであることをGoogleに示す。
ElementorにYouTubeのプレイリストを埋め込むために私が使っている正確な方法をご紹介します。
この記事の中で
- なぜElementorにYouTubeプレイリストを追加するのか？
- ElementorのYouTubeプレイリストを埋め込む最も簡単な方法
- ステップバイステップ：Elementor YouTubeプレイリストを埋め込む方法
- 比較：Elementor ビデオウィジェット vs. Smash Balloon
なぜElementorにYouTubeプレイリストを追加するのか？
Elementorは素晴らしいページビルダーですが、デフォルトの動画ウィジェットには制限があります。主に単体の動画用に設計されています。プレイリスト全体を埋め込むことで、以下のことが可能になります：
- 訪問者のサイト滞在時間を延長： サイト上で動画の視聴が始まると 、他のコンテンツよりもはるかに長く視聴者の関心を維持できます。
- 売上を伸ばす：ページに製品のレビューやお客様の声を掲載することで、訪問者に購入を決断させることができます。
「世界中で調査対象者の90％以上が、YouTubeで新しいブランドや製品を発見していると回答しています。」
– Googleで考える
- チャンネル登録者数を増やす：ご自身のサイトに動画コンテンツを投稿することで、チャンネルを成長させ、YouTubeでより多くの顧客にリーチすることも可能です。
- コンテンツ更新の自動化：YouTubeプレイリストに動画を追加すると、自動的にサイトに表示されます。これにより時間を節約できます。
一番の利点はElementorに動画プレイリストを埋め込むために、Elementorアドオンを購入したり、あなたのサイトにElementor Proを導入したりする必要はありません。
ElementorのYouTubeプレイリストを埋め込む最も簡単な方法
すべてのオプションの中で、YouTube Feed ProはElementorにYouTube動画を追加する最良の方法として際立っています。
私がこのプラグインを選ぶ理由は3つある：
- WordPressやElementorに慣れていなくても、セットアップも使い方もとても簡単です。
- YouTubeのプレイリストが人目を引くように、たくさんのデザインオプションが用意されています。
- プラグインはスピードを念頭に置いて構築されているため、サイトの読み込みはこれまでと同様に高速です。
プレイリストを埋め込むだけでなく、YouTubeのビデオギャラリーやライブストリームなどをウェブサイトに追加することもできる。
また、YouTube Feed Proは、Elementorを含むすべての主要なページビルダーと完全な互換性があります。つまり、他のサイトビルダーに乗り換えても、このツールを使い続けることができる。
作成したすべてのYouTubeフィードは自動的にElementorウェブサイトのデザインをコピーします。さらに、ライブエディタを使ってフィードを詳細にカスタマイズできます。
おまけに、YouTube Feed Proは専門家チームによってサポートされている。だから、彼らはあなたがこのプラグインでスムーズな経験を得ることを確認します。
プラグインの品質を確かめたいなら、ユーザーレビューを見てください。4.9/5つ星の評価で、YouTube Feed Proに満足しているのは明らかです。
TL;DR YouTube Feed Pro を使えば、サイトにぴったり合ったプレイリストを埋め込み、超高速で読み込み、訪問者を飽きさせません。
ElementorサイトにYouTubeフィードを追加する準備はできましたか？今すぐ YouTube Feed Pro をあなたのサイトに！
ステップバイステップ：Elementor YouTubeプレイリストを埋め込む方法
さっそくElementorウェブサイトにYouTubeプレイリストフィードを追加してみましょう。そのためには、以下の手順に従ってください。
ステップ 1: YouTube Feed Pro プラグインをインストールする
まず、YouTube Feed Proプラグインを入手する。そして、インストールして有効化してください。
プロのアドバイス：サイトにプラグインを追加する方法がわからない場合は、WordPressプラグインのインストール方法に関する記事をご覧ください。
アクティベーション時には、ライセンスキーの入力が必要となります。このキーは、Smash Balloonウェブサイトのアカウントページで確認できます。
ウェブサイトに戻る前に、ここにライセンスキーをコピーしてください。
では、ダッシュボードからYouTubeフィードの「設定」メニューを開いてください。
すべてのプラグイン機能を有効にするには、ライセンスキーをフィールドに貼り付けて「有効化」をクリックしてください。
ステップ2：YouTubeプレイリストフィードを作成する
プラグインの準備ができたら、YouTube Feed Proを使ってサイトに新しいYouTubeフィードを作成することができます。
そのためには、ダッシュボードからYouTube Feed " All Feeds メニューに行き、Add New ボタンをクリックします。
その後、プラグインは埋め込みたいYouTubeコンテンツの種類を選択するよう求めます。
続行するには、ここでプレイリストオプションを選択し、[次へ]をクリックします。
これでYouTubeアカウントに接続し、サイトに動画を表示することができる。
注：YouTubeチャンネル、単体の動画、検索結果、ライブ配信などから動画を埋め込むことができますが、本日はプレイリストに焦点を当てます。
ステップ3：YouTubeアカウントに接続する
YouTubeアカウントを接続する最も簡単な方法は、YouTube APIキーを入力することです。
まず始めに、APIキーの作成方法についてこちらの便利なチュートリアルをご覧ください。APIキーを取得したら、それをコピーして、ご自身のウェブサイトに戻ってください。
次に、APIキーをポップアップに貼り付け、Addをクリックして続行します。
これで、正しいプレイリストIDを見つけることで、WordPressウェブサイト用のYouTubeプレイリストを選択できるようになりました。
まず、ウェブブラウザでYouTubeのプレイリストを開き、一番上にある動画プレイリストのURLを検索します。
URLからプレイリストIDを取得するには、"list="以降をすべて取り出してコピーする 。
それを手に入れたら、Elementorサイトに戻り、そこのプレイリストIDフィールドに貼り付けることができます。
最後に「次へ 」をクリックして、YouTubeからプレイリストをリンクする。
ステップ4: Elementor YouTubeプレイリストをカスタマイズする
ソースを追加したら、YouTubeフィード用に事前に作成されたテンプレートをインポートするかどうかを選択できます：
- デフォルト
- カルーセル
- カード
- リスト
- ギャラリー
- 最新ビデオ
- ショーケース・カルーセル
- ウィジェット
インポートしたいデザインのテンプレートを選択し、「Next」をクリックします。
テンプレートを選択すると、ビジュアルカスタマイザーにYouTubeフィードが表示されます。
左側のパネルには、フィードのレイアウト、テンプレート、再生アイコン、配色、ヘッダーのスタイル、タイポグラフィなどを変更するオプションが表示されます。
変更を加えると、右側のライブプレビューでYouTubeフィードがどのように表示されるかを確認できます。
これらのデザインオプションをいくつか見てみましょう。そうすればビジュアルカスタマイザーの仕組みがわかります：
YouTubeプレイリストのレイアウトを設定する
左側の フィードレイアウトオプションから始めて ください。
次に、プレイリストのレイアウトのオプションを見るために、レイアウトセクションを見て ください。
ここには4つの異なるレイアウトオプションがあります：グリッド、ギャラリー、リスト、カルーセルです。
グリッド オプションを使うと、サムネイルを行と列のあるきれいなグリッドで表示できます。一度にたくさんの動画を表示するのに最適な方法です。
Elementorのプレイリストで特定のYouTube動画をハイライトしたいですか？
その場合は、代わりにギャラリーオプションを試してみてください。
すべての動画を1列に表示したい場合は、リスト オプションをお試しください。
YouTubeの公式レイアウトにかなり似ており、各ビデオのスペースが広くなっている。
最後に、カルーセルレイアウト です。このオプションでYouTubeプレイリストをダイナミックなスライドショーで表示できます。
一番気に入ったものを選び、「保存」をクリックする。
また、動画数、列数、行数などもここから選択できます。
カスタマイズボタンをクリックして、YouTubeプレイリストのデザインを続けることができます。
YouTubeプレイリストフィードの色を変更する
次に、YouTubeフィードの色を変更するために、配色 オプションをクリックします。
一度に簡単に色を変えられるように、好みの配色を選べばいい：
- テーマからの継承： テーマの色を自動的にコピー
- 明るい：暗いフォントで明るい背景を表示する
- ダーク：暗い背景に明るいフォント
- カスタム：手動でフィードのすべての色を選択します。
保存]をクリックして、Elementor YouTubeプレイリストの配色を確定できます。
ご覧のように、YouTube Feed ProにはYouTubeプレイリストをカスタマイズするための簡単なオプションがたくさんあります。
ここから、追加オプションを使って、フィードのヘッダーのデザイン、ライトボックスのオプション、ボタンのデザインなどを変更することができます。
さらに、このプラグインは自動的にあなたのサイトの外観をコピーするので、YouTubeのプレイリストはあなたのブランディングに完璧にマッチします。
ステップ5：YouTubeプレイリストをElementorに追加する
では、YouTubeのプレイリストをElementorに簡単に埋め込む方法を紹介します。ライブフィードエディタからも始められます。
右上の埋め込み ボタンをクリックしてください。
そうすると、YouTubeフィードの埋め込みオプションが開きます。
ポップアップでは、YouTubeプレイリストをサイトに埋め込む方法を選択できます。
Elementorページに埋め込むため、コピーボタンをクリックしてください。
そうしたら、Pages " Add Newに 移動し、ブロックエディターでページを開きます。
次に、Elementorで編集 ボタンをクリックします。
WordPressの投稿を使うこともできます。その場合は、Posts " Add Newに 進み、Elementorで編集をクリックします。
Elementorエディタを開いたら、左側のElementorウィジェットが並んでいるパネルを見てください。
検索フィールドに "shortcode " と入力すると、検索結果にショートコード・ウィジェットが表示されます。
YouTubeプレイリストフィードを埋め込むには、ショートコードウィジェットを ドラッグして ページにドロップ します。
YouTubeフィードを埋め込むには、ショートコードを入力フィールドに 貼り付けるだけです。
そうすると、右側にYouTubeビデオのプレイリスト・ウィジェットが表示されます。
最後に、左下の「公開 」または「更新」 ボタンをクリックします。
このように、新しいElementor動画プレイリストウィジェットが追加されました！同様に、Instagramフィード、Twitterフィード、TikTokフィードなども、適切なツールを使って埋め込むことができます。
これで、ワードプレスのウェブサイトをチェックし、どのように見えるかを確認することができます。
それで終わりだ！
ElementorのページにYouTubeのプレイリストを埋め込めるようになりました。YouTube Feed Pro プラグインを使えば、サイドバーウィジェット、フッターウィジェット、投稿などに YouTube プレイリストを埋め込むこともできます。
関連動画のプレイリストがあれば、Elementorのページはより魅力的になります。訪問者を転換させ、より多くの売上を得るための素晴らしい方法です。
YouTubeフィードをサイトに表示したいですか？今すぐYouTube Feed Proを手に入れよう！
YouTubeチャンネルを立ち上げたいですか？YouTubeチャンネルを成長させる方法についてのガイドをご覧ください。
比較：Elementor ビデオウィジェット vs. Smash Balloon
この方法がElementorの動画ウィジェットより優れている理由を知りたい場合、簡単な比較を以下に示します：
| 特徴 | Elementor ビデオウィジェット | YouTubeフィード・プロ |
| コンテンツソース | 単一動画URL | プレイリスト、チャンネル、検索、ライブ |
| レイアウト | シングルプレイヤー | グリッド、カルーセル、ギャラリー、リスト |
| 更新情報 | マニュアル（リンクを変更する必要があります） | 自動（YouTubeと同期） |
| カスタマイズ | 基本（アスペクト比、自動再生） | 上級者向け（カラー、テーマ、テンプレートなど） |
| サイト速度 | 複数追加された場合、速度が低下する可能性があります | スマートキャッシュと遅延読み込み機能を搭載 |
その他のソーシャルメディア・チュートリアル＆ハック
- インスタグラムのフィードをウェブサイトに埋め込む方法
- アフィリエイト・マーケティングにおけるソーシャルメディアの活用法
- ElementorウェブサイトにTikTokフィードを埋め込む方法
- YouTubeチャンネル・フィードをウェブサイトに追加する方法
- InstagramのフィードをElementorのウェブサイトに埋め込む方法
