ホーム  >   PHP / WordPress

WordPressで投稿した動画の再生オプションを自動変更する

公開日

最終更新日

SNSでシェアする  

WordPressのブロックエディタで動画を投稿した際に、パソコンから投稿した動画は設定画面で、

  • 自動再生
  • 繰り返し再生
  • ミュート（消音）
  • プレイバックコントーロール（デフォルトで有効）

上記のオプション変更が行えます。

しかし、公式スマホアプリからスマホ動画の投稿を行うと、動画の設定を変更出来ません。

しかたなく自動的に動画再生オプションを変更する方法を調べました。まずパソコン版からオプションを有効にした時に追加されるHTMLタグは、

  • 自動再生 = autoplay
  • 繰り返し再生 = loop
  • ミュート = muted
  • プレイバックコントーロール = controls

上記のHTMLが「video」タグの属性に追加されているのを確認しました。

という事は、投稿した記事の中にある「video」タグの属性を自動置換すれば、自動的に動画再生オプションを追加できる事になります。

WordPressのフィルター機能を使う

「functions.php」に以下のフィルター関数を追加します。

・「自動再生」のみを追加するサンプル

add_filter('the_content', function($content) {
	$content = str_replace('<video controls src=', '<video autoplay controls src=', $content);
	return $content;
});

サウンドがONの場合には、スマホでは自動再生が実行されません。

・「自動再生」「ミュート」「インライン」を追加するサンプル 

add_filter('the_content', function($content) {
	$content = str_replace('<video controls src=', '<video autoplay playsinline controls muted src=', $content);
	return $content;
});

スマホでは「自動再生」を有効にして読み込みを実行しないとサムネイル（ポスター画像）が表示されません。

サムネイルの表示目的で「自動再生」を有効にしたい場合には、実際には自動再生できないようにします。

・スマホ、タブレットのみ 「自動再生」 属性を有効にする。ミュートしていないので自動再生はされない（サムネイルの表示目的）

add_filter('the_content', function($content) {
	if(wp_is_mobile()){
		$content = str_replace('<video controls src=', '<video autoplay controls src=', $content);
	}
	return $content;
});

上記のサンプルでは投稿ページを開いただけでギガを消費するのでご注意ください！

 カテゴリー: PHPWordPress