アイアムビリーバー |

夢想家でも出来たことやったこと

スマホでYOUTUBE動画がきれいに表示できるAdvanced Responsive Video Embedder

916 views

WORDPRESSのプラグイン Advanced Responsive Video Embedder で、簡単に動画の画面をレスポンシブにサイズ変更することができて、スマホにも対応できると聞いて試してみました。

試してみたイメージ画像
photo credit: Summer ‘o8 via photopin (license)

 

Advanced Responsive Video Embedderのインストール後

インストールしたプラグインを有効化すると「Embed Video」のボタンが増えています。

Advanced Responsive Video Embedder

これを押して動画を追加できるのかな?

設定は以下の通りにしました。
Advanced Responsive Video Embedder
 

① 追加したい動画のURLを貼りました
② MODEをNormalにしました
③ Alignで配置指定をLeftにしました←centerに直しました。
④ URL Parametersに共有コード(共有アドレス)を貼りました

 
それで結果が以下の通りです。

これで大丈夫なのか下書きとして保存してプレビューしてみたところ、配置指定をLeftにすると、それ以降のテキストが回りこんでしまうので「center」に変更しました。ご自身のサイトの仕様に合わせてみて下さい。

 

YOUTUBEにアップしている動画を並べてみました

Twitter @dread386がギターで弾いてみた動画
 
sleepwalk ken yokoyama風

弾いてみた!mosh under the rainbow ギターソロ

弾きたくなりました!ハイスタ stop the time 風 エンディングソロ

ギターを久々に弾くと楽しいですね

ken yokoyama – Dry Spell ギターソロ 弾いてみた!

Ken Yokoyama – why のギターソロを弾いてみた

Ken Yokoyama の Remember Me ギターソロを弾いてみた

Ken Yokoyama – I LOVE ギターソロを弾いてみた!

Ken Yokoyama – Not Fooling Anyone のギターソロを弾いてみた!

Ken Yokoyama – How Many More Times を弾いてみた!

ken Yokoyama Believer 弾いてみた!

Ken Yokoyama “Running On The Winding Road” 弾いてみた!

KEN YOKOYAMA Let The Beat Carry On 弾いてみた

KEN YOKOYAMA – LOST YOU 弾いてみた

no woman no cry 風ソロ vol.001

ウォレントのbig talkを思い出して弾いてみた

WARRANTのSometimes She Criesのイントロ風

使用してみて思ったこと

これで動画がやっとスマホに対応できたのかなと思いました。昨日までは、埋め込みコードのサイズを更に小さくカスタマイズしていました。投稿の際も、div class=”video-container” 埋め込みコード /div みたいな記述をしていました。ちょっとスマートになった気がします。

Google Search Consoleの画面では「モバイル ユーザビリティ上の問題が検出されました」と表示されていますが、これは動画が原因ではないようです。とにかくスマホに対応しないと「問題」「問題」と表示されてしまいますので、未対応の部分は随時していきたいと考えています。

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

Twitter で