WPのサイトに動画を設置 スマホで動画のサムネイルが表示されないときの対処法

富士市が街のPR動画を制作したので見てみた結果静岡県富士市のホームページ制作

WPのサイトに動画をアップしました。

パソコンで見ると動画のサムネイルが表示されるのですが、スマホで見ると動画のサムネイルが表示されません。空白となり再生ボタンだけが表示されていました。

再生ボタンを押すと動画を再生することはできるのですが、ちょっとカッコ悪い・・・。

その時に使用したタグは以下のものです。

<video controls controlslist=”nodownload” oncontextmenu=”return false;” src=”動画のURL”></video>

 

これを以下のようにすることで、スマホでもサムネイル表示がされます。

<video controls controlslist=”nodownload” oncontextmenu=”return false;” poster=”サムネイル画像のURL” src=”動画のURL”></video>

 

つまり、サムネイルとなる画像を別に作成し、スマホで空白となっていた部分に被せるといったものだと思われます。