ElementorにYouTubeチャンネルを埋め込む方法(5分でできる)
ホーム ブログ ElementorにYouTubeチャンネルを埋め込む方法(5分でできる)

ElementorにYouTubeチャンネルを埋め込む方法(5分でできる)

ElementorにYoutubeチャンネルを埋め込む方法

ElementorにYouTubeチャンネルを埋め込む方法をお探しですか?

人気のページビルダーであるElementorは、あなたのブランドを宣伝し、より多くのフォロワーを獲得するのに役立つ魅力的なウェブサイトを作成することができます。

さらに、YouTubeの動画を表示することで、簡単にエンゲージメントを高め、オンラインでの存在感を高めることができます。

このガイドでは、Elementor WordPressサイトにYouTubeチャンネルを埋め込む簡単な方法をご紹介します!

ElementorのYouTubeチャンネルを埋め込む方法

ElementorにYouTubeフィードを追加するには、2つの異なる方法を選択できます:

  • 手動の方法:動画の埋め込みコードを取得し、Elementorに追加します。
  • 簡単な方法 WordPressのプラグインを使って、YouTubeの動画をElementorに素早く埋め込む。

手動の方法では、YouTubeを開き、動画の埋め込みリンクを手動で取得する必要がある。 

YouTube動画の共有ボタンをクリックし、埋め込みをクリックすることで可能です。

手動でYouTubeを埋め込む

これにより、Elementorを使用して任意の投稿/ページに追加できる動画埋め込みコードが得られます。

しかし、複数のYouTube動画を埋め込む場合、この方法は多くの時間と労力を要する。

しかも、埋め込む新しい動画があるたびに、もう一度すべてのプロセスを繰り返さなければならない。

さらに、このレイアウトではYouTube動画の埋め込みをカスタマイズすることができません。そのため、あなたのYouTubeコンテンツは、入念にデザインされたElementorサイトと衝突してしまう可能性があります。

手動埋め込みビデオ

良いニュースは?WordPressのプラグインを使用することで、これらの問題を回避することができます。

そして、YouTube Feed Proという最高のプラグインがある。

youtubeフィードプロプラグインスマッシュバルーン

市場でNo.1のYouTubeフィードプラグインとして、コーディング不要で簡単にElementorサイトに動画を作成、カスタマイズ、埋め込むことができます!

プラグインの3ステップのガイドフローに従うだけで、YouTube動画のフィードをわずか数分で準備できる。

さらに、YouTube 動画フィードのデザインを完全にコントロールできます。ライブフィードエディターから、数回クリックするだけで、フィードの外観を変更できます。

Youtubeフィードプロプラグイン用ライブフィードエディタ

YouTubeチャンネルだけでなく、お気に入りリストやYouTubeプレイリスト、ライブストリームなどの動画を埋め込むことができる。

YouTube Feed Proは、スピードを念頭に置いて設計されているため、お望みの数のビデオを埋め込むことができ、あなたのウェブサイトはこれまでと同じように高速に読み込まれます。

また、YouTube Feed ProにはWordPressの専門家によるサポートチームが付属しているのが最大の特徴だ。

何か問題や質問があれば、いつでも彼らに助けを求めることができる。

これらすべての特徴と機能により、YouTube Feed Proは市場で最高のYouTubeフィード・プラグインである。

YouTubeチャンネルを埋め込む準備はできましたか?YouTube Feed Pro はこちらから入手できます

ElementorにYouTubeチャンネルを埋め込む方法

今回のチュートリアルでは、YouTube Feed Proを使ってElementorにYouTube動画を埋め込む方法をご紹介します。 

始めよう!

ステップ 1: YouTube Feed Pro プラグインをインストールする

まず、YouTube Feed Proを入手し、コンピューターにダウンロードします。次に、WordPress Elementorウェブサイトにプラグインをインストールし、有効化します。

その方法を学びたい場合は、WordPressプラグインを簡単にインストールする方法についてのチュートリアルをご利用ください。

プラグインを有効にしてインストールしたら、次のステップに進んでください。

ステップ2: 新しいYouTubeチャンネルフィードを作成する

まず、WordPressのダッシュボードでYouTube Feed " All Feedsをクリックして、プラグインのフィードメニューを開く必要があります。

次に、上部にある「新規追加 」をクリックする。

新しいYoutubeフィードを追加。

その後、6つの異なるユニークなフィードタイプのオプションを使用してビデオギャラリーを作成するオプションが与えられます。

あなたのチャンネルからコンテンツを埋め込むだけでなく、プレイリスト、お気に入りリスト、検索語などを選択することができます。

続行するには、 Channelオプションを選択し、Next ボタンをクリックします。

YouTubeフィードの種類を選択.jpg

新しいYouTubeフィードを作成したら、動画を表示するためにチャンネルに接続する必要があります。

その方法については、ガイドの次のステップに従ってください。

ステップ3:YouTubeチャンネルに接続する

このフィードをYouTubeチャンネルに接続する場合、2つのオプションがあります:

  • YouTubeのAPIキーを使用する
  • YouTubeアカウントに接続する

より多くの種類のYouTubeコンテンツを埋め込みたい場合は、ポップアップでAPIキーを追加をクリックしてください。

apiキーが必要 youtubeフィードプロ

まだキーをお持ちでない方は、YouTube APIキーの作成方法についてのチュートリアルをご覧ください。

APIキーが手に入ったら、それをコピーして もう一度ウェブサイトに戻る。

次に、ポップにAPIをペーストして Addをクリックする。

youtubeにapiキーを追加

YouTubeのAPIキーを使いたくないですか?

その場合は、ポップアップに表示される「YouTubeアカウントと接続する」をクリックしてください。

Youtubeアカウントに接続する

そうすることで、YouTubeのコンテンツへの読み取り専用アクセスをプラグインに与えることができる新しいページにリダイレクトされます。

このアクセスにより、YouTube Feed Proはあなたのコンテンツを閲覧するだけで、変更を加えることは一切できません。そのため、100%リスクフリーです。

続行するには、ポップアップの「続行」 ボタンをクリックします。

YOUTUBEフィードプロに読み取り専用アクセスを許可する

次のステップでは、YouTubeチャンネルを選択することで、プラグインがあなたのウェブサイトに動画の取得を開始します。

ステップ4:YouTubeチャンネルを選択する

まず、ウェブブラウザでhttps://www.youtube.com/、YouTubeチャンネルを開きます。

ページの一番上にYouTubeチャンネルのURLがあります。

ここで必要なのは、URLの末尾にあるコードをコピーするだけだ。

ユーザー名をコピーする。

最後に、ワードプレスのウェブサイトに戻り、チャンネルIDまたはユーザー名フィールドにIDをペースト することができます。

これで「次へ 」をクリックし、YouTubeアカウントとの接続を完了します。

YouTubeフィードのソースを入力

その後、新しい Elementor YouTube チャンネルフィードをオンラインで公開できます。プラグインは自動的にあなたのウェブサイトのデザインをコピーし、箱から出してすぐに美しく見えます。

フィードを埋め込む前に、次のステップで見栄えをカスタマイズできます。

ステップ5:YouTubeチャンネルのフィードをカスタマイズする

YouTube Feed Proには、フィードやギャラリーに使用できる膨大な数のカスタマイズオプションがあります。これらのオプションのいくつかと、それらを有効にする方法を見てみましょう。

まず、フィードのテンプレートを選択します。このプラグインには8種類のテンプレートが用意されています:

  • デフォルト
  • カルーセル
  • ショーケース・カルーセル
  • カード
  • ギャラリー
  • リスト
  • 最新ビデオ
  • ウィジェット

使用するテンプレートを選択し、「Next」をクリックします。このデモでは、Default オプションを使用します。

フィードテンプレートを選ぶ youtubeフィードプロ

次へ」をクリックすると、ライブフィードエディターを使ってYouTubeフィードの詳細をカスタマイズできるようになります。 

左側のパネルには、カスタマイズ可能なすべてのフィードエディタオプションが用意されています。レイアウト、色、動画要素、その他もろもろを変更できます。

ライブフィードエディタ youtubeフィードプロ

右側のライブプレビューパネルは、リアルタイムですべての変更点のプレビューを表示するので、どのオプションがあなたのフィードに最も適しているかを簡単に判断できます。

では、これらのカスタマイズ・オプションのいくつかを簡単に見てみよう。左のパネルにある「Feed Layout」をクリックします。

フィードレイアウトオプションを開く youtubeフィードプロ

これにより、Elementor動画ギャラリーに4つの異なるレイアウトが提供されます:グリッド、ギャラリー、カルーセル リストです。

これらのレイアウトオプションはすべて、あなたのYouTubeチャンネルをさまざまな方法で紹介します。

フィードレイアウトオプション youtubeフィードプロ

グリッドレイアウトは 、動画を行と列で整然と表示するテーブルグリッドを提供します。

こうすることで、動画をきれいなレイアウトで一度に表示することができます。

グリッド・レイアウト・ユーチューブ・フィードの例

ギャラリー・レイアウトでは 、特定の動画に重点を置くことができ、他の動画は下に小さいサムネイルで表示されます。

特定のビデオに特別な注目を集めたい場合は、このオプションをご利用ください。

ギャラリーレイアウト ユーチューブビデオフィード

同様に、リスト・ オプションは、ビデオを1つの大きな列で表示します。

これにより、複数のYouTube動画を表示するためのスペースが格段に広くなる。

ユーチューブ用リストレイアウト

最後に、カルーセルオプションを 使えば、ユーザーがインタラクティブに操作できる最小限のスライドショー/カルーセルに動画を追加できます。

カルーセルレイアウトYoutubeフィードプロ

フィードに最適なカルーセルを選び終わったら、「保存」をクリックして変更を保存します。

次に、YouTubeフィードのヘッダーをカスタマイズする方法を見てみましょう。カスタマイズ ボタンをクリックして、メインのオプションパネルに戻ります。

YouTubeチャンネルの上に表示されるヘッダーを変更したいですか?

次に、左側のヘッダーオプションをクリックします。

オープンヘッダーオプション

上部に、YouTubeチャンネルフィードウィジェットのヘッダーを有効または無効にするオプションがあります。

その下で、2つのヘッダースタイルオプションから選択することができます:

  • 標準:チャンネル名、アイコン、その他の情報をフィードの上部に表示します。
  • テキスト YouTubeチャンネルフィードのトップに表示する見出しを書きます。

最後に、チャンネルの説明と 購読者数を表示または非表示にするオプションがあります。

ヘッダーオプション youtubeフィードプロ

カスタマイズが完了したら、「保存 」をクリックして変更を確定します。

カラースキームのカスタマイズが終わったら、もっと見るボタンを変更したり、Elementorギャラリーにフィルタを追加するなど、他のカスタマイズオプションを調べることができます。

カスタマイズが終わったら、もう一度「保存 」をクリックする。

これで、YouTubeチャンネルをElementorウェブサイトに追加する準備ができました。

ステップ 6: ElementorにYouTubeチャンネルを埋め込む

YouTubeフィードをElementorに埋め込むには、ライブフィードエディタから直接始めることができます。

まず、上部にある埋め込み ボタンをクリックします。 

Youtubeフィードを埋め込む

これにより、Elementorのウィジェット、ページ、ブロックに追加できるフィード用のユニークなショートコードが得られます。

ショートコードの横にあるコピー ボタンをクリックして、クリップボードに保存します。

ショートコードをYoutubeに埋め込む

次に、WP管理画面のページ " 新規追加をクリックして新しいページを開きます。

次に、Elementorエディタでページをカスタマイズするために、Elementorで編集をクリックします。

新しいワードプレスページを作成する

もちろん、投稿 " 新規追加をクリックして、YouTubeフィードを新しい投稿に追加することもできます。

その後、Elementorのビジュアルエディタを開くには、Elementorで編集をクリックします。

ワードプレスの新規投稿を作成する

Elementorでページ/投稿を開くと、左側のパネルにElementorのすべてのウィジェットが表示されます。

ここから、上部の検索バーを使って 「ショートコード」ウィジェットを検索することができる。

elementor 用ショートコードウィジェット

ショートコードウィジェットを 右側のライブカスタマイザーにドラッグ するだけです。

elementor 用ショートコード・ブロック

ショートコードウィジェットの動作を変更するためのオプションが増えました。

次に、左側のパネルにあるショートコードを入力するフィールドを探し、先ほど保存したショートコードを貼り付けます

最後にElementorのPublishボタンをクリックすると、YouTubeチャンネルがElementorサイトに埋め込まれます。

ご覧のように、YouTube Feed Proはこのプロセス全体を超簡単にします。ElementorのYouTubeフィードが訪問者にどのように見えるか、投稿やページで確認することができます。

ユーチューブ・エレメンタル・ビデオ・フィード

そうだ!

WordPress初心者でも、WordPressプラグインを使ってElementorにYouTubeチャンネルを埋め込む方法がわかりました。

このように、YouTubeチャンネルを簡単に成長させることができます。あなたのブランドのオンラインプレゼンスを高め、より多くの人々にリーチする素晴らしい方法です。

YouTubeチャンネルをサイトに埋め込む準備はできましたか?YouTube Feed Pro を使い始めましょう。

YouTubeプレイリストを埋め込みたいですか?ElementorにYouTubeのプレイリストを埋め込む方法については、こちらのガイドをご覧ください。

最後に、このガイドが役に立ったなら、ツイッターや フェイスブックでYouTubeのチュートリアルをフォローしよう。

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。