Personal WP Customization Notes (PWCN)

WordPressで実際に行ったカスタマイズの記録、発生した問題への対処時のメモ、ブロックテーマのカスタマイズなど

動画ブロックのプレイバックコントロールを有効にした時にある「ダウンロード」リンクを無効にする方法

久しぶりに「動画」ブロックを挿入してみて気づいたのが、プレイバックコントロールを有効化した際一番右に表示される三点リーダー(点が縦に3つ並んだボタン)をクリックした時に出てくるダウンロードボタン。

「あれ?ダウンロードできるようになってる?」とちょっとびっくりしました。

いやいやダウンロードさせちゃいかんでしょ!ということで以下のようにダウンロードボタンを非表示にする方法を2つ紹介します。

この方法は公式フォーラムの「Disable Video Download」にあった、videoタグに「controlsList=”nodownload”」を追加することで無効にできるというヒントを基に2種類の方法をコード化したものです(ちなみにフォーラムにあるCSSの方法は私の環境では無効になりませんでした)。

このサイトでも現在導入していて、以下のページで動画ブロックを埋め込んでいるので、確認してみてくださいね。

プレイバックコントロールからダウンロードを無効にする方法

jQueryを使用する、PHPを使用するのいずれかで無効にできます。サイトの環境に合わせて選択してください。

どちらもvideoタグに対して「controlsList=”nodownload”」を追記する(挿入する)というもので、どちらを使っても特に動作の違いや処理速度に違いはないと思います。

ただし、videoタグで出力されるものすべてに影響が及びますので、他のブロックなどを使用する際にはよく確認するようにしてください(動画ブロックで処理されるかのテストのみしかしていません)

jQueryを使う方法

テーマや子テーマでjQueryを読み込むような機能がある場合には以下の簡単なコードで実装できます。

jQuery(document).ready(function($) {
  $('video').attr('controlsList', 'nodownload');
});

PHPを使う方法

有効化しているテーマのfunctions.phpへ以下を追加することで実装できます。

function pwcn_disable_download_to_video_block($content) {
//videoタグにcontrolsList="nodownload"を追加
	$content = preg_replace('/<video(.*?)>/', '<video$1 controlsList="nodownload">', $content);
    
	return $content;
}
add_filter('the_content', 'pwcn_disable_download_to_video_block');

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

※リンクやURLの挿入されているコメントは無視します