Your Channel | Youtubeチャンネルを埋め込むWordPressプラグイン

Word Pressプラグイン Your Channel

日本で馴染みのあるメディアとなった動画共有サイトYoutubeですが、自分のチャンネルを登録しているクリエイターやユーチューバーなら、自分をPRするウェブサイトにチャンネルを埋め込みたいと思った事は無いでしょうか?
WordPressならプラグインで簡単に自分のチャンネルを埋め込む事が可能ですので、今回は導入や設定方法をご紹介します。

WordPressサイトにYoutubeチャンネルを埋め込む!その方法とは?

ホームページに自分のYoutubeチャンネルを埋め込みして手間をかけずに新着動画を表示させたいなんて事は思った事はないでしょうか?
WordPressならプラグインを無料でインストールするだけで、新着順にアップロード動画を表示して、さらに自動更新までしてくれる優れものなのです。その方法とは?

WordPress用プラグイン Your Channel

Word Pressプラグイン Your Channel
このウェブサイトとは別のPR用ウェブサイトに埋め込んだYoutubeチャンネルですが、新しく投稿した順番に表示してクリックするだけで動画再生もできる素晴らしい機能なのです。
私もそうですが、CSSとかHTMLとかよくわからなくて埋め込み方を知らないという人でも一発で表示する事ができるようになりますので、このプラグインのインストール方法を解説します。

Your Channelのインストール方法

WPプラグイン Your Channel
今回インストールするのは、WPプラグインのYour Channelです。
WPの管理画面にあるプラグイン→新規追加の項目でYour Channelと検索するか、こちらのページからプラグインをダウンロードしてください。
念のため類似のプラグインは無いと思いますが、作者がPlugin Buildersとなっているのがそうです。

WordPressプラグインページで検索したなら、Your Channelの項目にある今すぐインストールをクリックして有効にします。
プラグインをダウンロードした場合は、プラグインのアップロードという項目でダウンロードした圧縮ファイルごとインストールして有効にして下さい。

初期設定に必要な YouTube Data API v3 Keyを取得する

API Keyを取得するには、自身のGoogleアカウントでログインをしてからGoogle API Consoleのページにアクセスして下さい。

Google API Console 管理画面
プロジェクト名はデフォルトか任意の名前で構いませんので、作成をクリックして先に進みます。

Gogle API Console APIとサービス
左上のナビゲーションメニューからAPIとサービスにカーソルを動かして、次の項目のライブラリをクリックすると上の項目が表示されます。
隠れていて見えないのですが、Youtube Data API v3という項目が今回使用するAPI Keyの発行場所ですので、ここをクリックして先に進みます。

Youtube Data API v3
YouTube Data API v3を選択したら、このような画面に切り替わりますので、認証情報を作成をクリックして先に進みます。

Youtube Data API v3
プロジェクトへの認証情報の追加を設定します。
使用するAPIは、Youtube Data API v3を選択、APIを呼び出す場所はウェブブラウザ(Javascript)、アクセスするデータの種類では一般公開データを選択します。
上の項目に入力が終わったら、必要な認証情報をクリックします。

次のページで表示される、APIキーのボックスの中にある文字列をテキストドキュメントなど、忘れない場所にコピーしておきましょう。忘れなければどこでもいいです。
ドラクエの復活の呪文みたいに手書きでも可。
このキーが今回使用するYour Channelプラグインの設定で使用するキーです。


Your Channelの設定

Your Channelの設定
WordPressの管理画面にある設定の項目にあるYourChannelをクリックして、WordPressサイトに表示するために必要となる初期設定を行います。

Your Channelの初期設定

WordPress Yourchannelプラグイン 設定
先程、Google API ConsoleのYouTube Data API v3で取得したAPI Keyを、YourChannelのAPI Keyの項目にコピペまたは入力します。

Youtubeの項目には、表示したいユーチューブチャンネルのユーザー名かチャンネルIDを入力します。

YoutubeチャンネルIDの確認と入力

YoutubeチャンネルのID確認
Youtubeのインターフェースは複雑すぎて似たような項目が沢山あってわかりにくいと思いませんか?
設定についても一か所ではなく、何か所も存在するので少しコンパクトにまとめて欲しい所・・。
今回設定するYoutubeチャンネルIDは、Youtubeトップ画面で右上のアカウントアイコンをクリックした後に、設定をクリックします。そこで表示される詳細設定から次の画面に入るとチャンネルIDをコピペまたは入力します。
ユーザーIDではないので間違えないように。

その他の設定項目

Cache Refresh
取得したYoutubeチャンネルを更新する時間です。初期設定は180分になっていますがアップロード頻度に合わせて時間を調整しましょう。

Show
何を表示するかの設定項目なので、デフォルトでは新着動画・再生リスト・チャンネルのバナーを表示しています。 不要な項目があればチェックを外しましょう。

Video missing
表示する動画をアップロードしていない場合にチェックを入れます。

Videos per load
1ページに表示する動画の数を指定します。数を多くしすぎるとページが重くなってしまうので、サーバーに負荷がかかりすぎない程度に増減しましょう。私は24に設定しています。

Max Videos
取得する動画数の上限を設定します。無制限の場合は空欄で、制限したい場合は表示したい数だけ入力しましょう。初期状態では500になっていますが、ここまで見てくれる人はいないと思うのでそのままでもOK!


Your ChannelのStyle設定

Your ChannelのStyle設定
Your Channelにはもう一つ設定項目があります。
動画リストをどうやって表示するかの設定なのですが、WordPressの表示幅で変動してしまうので、どんな感じで表示されるかチェックしながら設定した方が無難でしょう。
YourChannelの設定画面でも、プレビューが表示されていますがほとんどと言っていいほどアテになりません。

Video Theme

Style 
グリッド表示かリスト表示かを選択できます。

Thumb size
サムネイルのサイズの大きさです

Meta
動画のタイトルを表示するかしないかの設定です。
Noneで非表示になりますが、分かりやすいように入れておいた方が良いでしょう。

Show Description
動画の説明文を表示する設定です。最大限に表示されてしまうので、ごちゃごちゃしたのが嫌いなのであればチェックを入れない方が良いでしょう。

Gutter
動画と動画の間の幅を指定できます。

Play icon
サムネイルにPlayアイコンを表示するかしないか設定できます。

Sticky Player
動画を再生中に画面をスクロールした時の設定項目です。スクロールした時も追従して再生したい時はEnableにチェックを入れましょう。

Title
タイトルを表示する時の設定です。1行だけに表示したい時はSingle lineにチェックを入れましょう。

Saveをクリックして設定は終わりです!

Your Channelの設定トップ画面に、ショートコードが生成されますので表示したいページにショートコードを埋め込みます。

Your Channelの埋め込み方法

Affinger5のトップページ設定
私はWord Pressテーマ Affinger5を使用しているので、簡単に設定ができる別サイトのトップページに埋め込んでいます。
Your Channelで生成したショートコード、[Yourchannel user=”〇〇”]を記事などに入力して完成です。

デザインがたまに崩れたりしますが、割と目的通りの表示が出来たのではないかと思います!
こんなプラグインがあればいいなと思っていたのですが、探せばあるものですね!


YouTubeチャンネルバナー

Youtubeチャンネルでは、日本国内各地の美しい四季の風景、ネイチャービデオ、花火大会やイベント・お祭り等、クリスマスイルミネーションや夜景、星景タイムラプス映像、Vlog、飛行機や新幹線などの乗り物等の映像をライブラリー化し、世界各地に発信しております。
また、不定期で花火大会やイベントのライブ配信も実施中!
下のYouTubeアイコンからチャンネルを表示していただき、チャンネル登録後に通知をオンにしていただくとライブ配信の通知が受け取れます!
もちろん動画URLや埋め込みタグを使用したウェブサイトへの埋め込みやSNSでのシェアもOKです!

最新の更新情報を受け取れる各種SNSを運営中!フォローや登録はこちら!


X Postをタップして、@jvcameratravelを付けたまま記事をX(旧・Twitter)でシェアをすると、弊社運営のXアカウントにてあなたのポストをリポストするアカウント拡散キャンペーンを行っています。
不要な時は@jvcameratravelは外してね!

関連記事

  1. TCD ワードプレステーマGENSEN 検索フォーム

    TCD GENSENでSEO対策!検索機能が高性能でオススメの有料WordPressテーマのレビュー

  2. Xサーバーの高速化設定ページのサムネイル

    エックスサーバーの高速化設定!レンタルサーバーのパフォーマンス向上で快適に!

  3. WordPressプラグインWP Rocketの購入ページと3つの料金プラン

    WP Rocketのレビュー!高機能キャッシュ&最強のWordPress高速化プラグイン!

  4. オプション設定で添付ファイル自動生成ページが有効化になっている

    画像がサーチコンソールで未登録!WordPressメディア添付ファイルページを無効化する方法

  5. WordPressサイトのレイアウト崩れ修復方法

    WordPress管理画面のレイアウト崩れ修正方法!原因はレンタルサーバーの高速化機能

  6. ワードプレスプラグイン Autoptimizeの導入サムネイル画像

    WordPress高速化プラグインAutoptimizeの設定方法!CSS JavaScript 画像を最適化!

  7. 閉鎖したサブドメインのWordPressサイトから新サブドメインに301リダイレクトする方法 サムネイル画像

    閉鎖したサブドメインのWordPressサイトから新サブドメインに301リダイレクトする方法

  8. WordPressサイトの写真や画像が色褪せたり色が変わる原因の対策や対処法

    WordPressサイトの写真や画像が色褪せたり色が変わる原因の対策や対処法

  9. Googleサーチコンソールへの登録

    Googleサーチコンソールで検索登録してSEO対策!XMLサイトマップの送信と使用方法

  10. 自動読み込みがリスクになっているWordPressサイト

    WordPressプラグインの入れすぎがダメな理由を解説!アンインストール後も注意!

  11. Ultimate XML Sitemaps Generator for Googleのインストール

    動画と写真のXMLサイトマップ作成プラグイン!Google XML Sitemaps Generator Pro

  12. WP YouTube Lyteの設定方法サムネイル画像

    YouTubeのサムネイルをキャッシュするWordPress高速化プラグインWP YouTube Lyte

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

  1. 大崎市三本木ひまわりの丘 菜の花まつり-菜の花200万本の絶景が見頃!|宮城県大崎市

    200万本の花が咲く 大崎市三本木菜の花まつりを2025…

  2. あしかがフラワーパーク 大藤まつり ふじのはな物語 奇蹟の大藤ライトアップ

    花の名所 あしかがフラワーパーク 大藤まつりを2025…

  3. 宮城県大崎市 川渡温泉の菜の花と桜

    おおさき鳴子温泉菜の花ガーデンは2025年4月12日から…

  4. 宮城県角田市 蔵王連峰を背景に咲くかくだの菜の花畑

    菜の花が生育不良の「かくだ菜の花まつり」は2025年4…

  5. 九州地方佐賀県武雄市の観光名所 御船山楽園の花まつり

    ツツジの花が美しい御船山楽園 花まつり第2弾は2025…

  6. 福島県福島市 飯坂温泉 花ももの里の風景と菜の花

    飯坂温泉の桃源郷 花ももの里の開園期間は2025年4月1…

  7. 宮城県仙台市 榴岡公園の枝垂桜-夜桜ライトアップ

    榴岡公園 桜まつり 2025年3月27日から開催! ステージ…

  8. 仙台西公園で咲く満開の桜 とお花見を楽しむ人々

    桜名所 仙台西公園でお花見とステージイベントは2025…

  9. 山形県大蔵村 肘折温泉 いでゆ館

    山形肘折温泉の日帰り入浴施設 肘折いでゆ館が2025年…

  10. 茨城県石岡市の枝垂れ桜の名所 常陸風土記の丘

    枝垂桜が美しい常陸風土記の丘さくらまつりを2025年3…

楽天トラベルのバナー画像

よく読まれている人気記事ランキング




Amazonトップページバナー
楽天モバイルアフィリエイト