[WordPress] Youtubeを縦長動画のままで表示する

Youtubeは横長の9:16のアスペクト比ですが、動画によっては縦長だったり正方形に近いものであったりします。iPhone等のスマホでは縦長に対応できるようになりましたが、ブラウザー上ではそのままでは横長で左右に黒幕ができたりした表示になります。
WordPressで設定を幾つか修正すると、画面一杯に拡大しない状態では縦長で再生することが可能です。

sponsored link

縦長動画

 
YoutoubeでWordPressに埋め込むためのコードを取得します。
たとえ縦長動画をアップしても、左右に黒空白が作られて横長の9:16アスペクト比の動画に修正されてこのような形式で出てきます。
 

 
ここでiframeの縦横を入れ替えて縦長にします。
 

 
WordPressでは「ビジュアル」では縦長動画になっているのですが、実際のページでは画面の縦長に左右の黒空白追加された横長動画となってしまいます。
 
ここで</iframe>の前に改行を意図的に入れると
 

 
これで実際のページ表示では縦長で再生されます。
 
ページのソースを表示すると
 

 
<br />が入っているのが分かります。
ただ全画面にすると左右の黒空白が追加されてしまいます。

ページのトップへ戻る
 
sponsored link

シェアする

  • このエントリーをはてなブックマークに追加

フォローする