YouTube高速化埋め込みをパラメータで制御する方法

投稿・固定ページ
YouTube埋め込みプレイヤーの動作制御
この記事は約5分で読めます。
YouTube埋め込みの表示も高速化されたので、CocoonのYouTube高速化機能は現在無効にしてあります。

Cocoon 1.2.5から、YouTube動画の呼び出しをパラメータで制御出来るようにしました。

YouTube高速化埋め込みの詳細はこちら。

YouTube動画読み込みを高速化させる方法
YouTube動画を出来る限り軽く読み込む方法です。クリックすることでiframeに置き換わり動画が再生されます。

YouTubeパラメーター制御に関してはこちら。

YouTube 埋め込みプレーヤーとプレーヤーのパラメータ  |  YouTube IFrame Player API  |  Google for Developers

これにより、以下のようなことの制御ができるようになりました。

  • 関連動画を表示させるかどうか
  • 開始時間・終了時間の設定
  • プレイヤーコントロールを表示させるか
  • プレイヤーボタンなどの制御
この他にもいろいろ制御することができます。詳しくはYouTube埋め込みパラメーターを参照してください。

\エックスサーバー開発のWordPressテーマ/
エックスサーバー開発のWordPressテーマ

埋め込みURLの指定例

YouTubeの埋め込み表示は、エディターに対して以下のようにURLを記入するだけです。

ビジュアルエディターでYouTube動画埋め込み

このURLに対してパラメーターを指定することで、YouTubeプレイヤーを制御することも可能になりました。

以下では、URLパラメーター指定のサンプルをいくつか紹介します。

関連動画を表示する

関連動画を表示するには、rel=1パラメータを付け加えてください。

URL https://www.youtube.com/watch?v=OEb-EVFQVG4&rel=1

実際の表示はこちら。

Cocoonデフォルトでは、関連動画は非表示(rel=0)にしてあります。

プレイヤーを表示しない

パラメータで、controls=0を付け加えるとYouTubeプレイヤーが表示されなくなります。

URL https://www.youtube.com/watch?v=AoUxjQOQW7A&controls=0

実際の表示はこちら。

非表示にすると音量調整とかもできないので、あまり訪問者に優しいとは言えないです。ただ、やろうと思えばできるということで。

開始・終了時間を設定する

開始時間はstart、終了時間はendで秒単位で指定します。このように複数パラメータで指定することも可能です。

URL https://www.youtube.com/watch?v=Fu3u0YAh1G8&start=10&end=20

実際の表示はこちら。

- YouTube
Enjoy the videos and music you love, upload original content, and share it all with friends, family, and the world on Yo...
開始・終了時間を指定して、見せたい箇所だけをすぐに見せることも可能です。

デフォルトのパラメーターを指定するサンプル

毎回パラメーターを設定するのが面倒くさいという場合は、youtube_embed_default_argsフックを利用することで、全てのYouTube高速化埋め込みに対してデフォルト値を設定できます。

子テーマのfunctions.phpに以下のようなコードを記述してパラメーターを指定することでデフォルト動作を変更することが可能です。

//YouTube高速化埋め込みのデフォルトパラメータを設定したい時
add_filter('youtube_embed_default_args', 'youtube_embed_default_args_custom');
function youtube_embed_default_args_custom($args){
  //デフォルトのパラメーターを記入
  //ここで記入したものは、URLで入力したパラメータで上書きされる
  $args['rel'] = 1;
  $args['controls'] = 0;
  $args['start'] = 3;
  $args['end'] = 10;
  return $args;
}
youtube_embed_default_argsで設定したパラメーターは、エディターで埋め込まれたパラメーターで上書きされます。これにより、個々のエディター埋め込みパラメーターで設定を変更することが可能です。

強制的にパラメーターを実行したい場合

埋め込みURLパラメーターで指定したものを上書きする形で、強制的にパラメータを実行したい場合は、youtube_embed_argsフックを利用します。

設定を行う場合は、子テーマのfunctions.phpで以下のように書いて、パラメータを指定してください。

//YouTube高速化埋め込みの最終的なパラメータを設定したい時
add_filter('youtube_embed_args', 'youtube_embed_args_custom');
function youtube_embed_args_custom($args){
  //URLで入力したパラメーターも上書きできる
  $args['rel'] = 1;
  $args['controls'] = 0;
  $args['start'] = 3;
  $args['end'] = 10;
  return $args;
}

youtube_embed_argsで指定したものは、個々のエディター埋め込みパラメーターで設定したものより優先されます。「プレイヤーの呼び出し方法を変更したいけど記事をすべて編集するの面倒」といった場合に利用すると良いかと思います。

タイトルとURLをコピーしました