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の埋め込み方法


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

これが完了すると下のように表示されます。


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

この記事が気に入ったら
いいね ! しよう

こちらの記事もオススメかも

  1. WordPress ブログ記事を書き始めて11ヶ月目のアクセス数は?収益は?SEOや書き方も!

  2. WordPress3か月目の記事

    WordPressで記事を書いて3か月目 100記事のPV数やアドセンス収益を公開!

  3. udinra sitemap proの購入

    Udinra Sitemap pro|WordPress画像・動画サイトマップ作成プラグインの使用方法

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

    2020年版 Google サーチコンソールへの登録と使用方法

  5. WordPress 4ヶ月目のPV数や収益

    WordPressでブログ記事を書いて4か月目 137記事のPV数や収益などを公開!

  6. 10000pv達成記念画像

    WordPressを始めて3ヶ月で1万PV達成!!ブログのアドセンス収益も上昇中

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

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