ブログやサイトにyoutubeの動画を埋めこんだら、記事テンプレートからはみ出してしまった…そんな場合は埋め込み動画のサイズを変更してテンプレートの横幅にあわせましょう。
youtube埋め込み動画のサイズを変更する
まずはyoutubeの埋め込みたい動画の上で
右クリックを押して埋め込みコードを取得してください
埋め込みコードを一端、コピーします
ちなみに今回、例として取得したきゃりーぱみゅぱみゅの
ミュージックビデオの埋め込みコードはこちらです。
<iframe width="640" height="390" src="https://www.youtube.com/embed/teMdjJ3w9iM" frameborder="0" allowfullscreen></iframe>
数字の部分を書き換えることで動画のサイズを
変更することができます。
widthの数字を変更すれば横幅を、
heightのサイズを変更すれば縦幅を
変更することができます。
テンプレートによりけりですが、2カラムの
テンプレートならだいたい横幅600、3カラム
の場合は横幅500ぐらいにすればはみ出す
ことはないと思います。
あとは埋め込みコードを記事に貼り付ければ
記事に動画を埋め込むことができます。
スマホ表示の際、埋め込み動画がはみ出す場合
PCのテンプレートのサイズに合わせて
動画の横幅を設定したものの、スマホから
見たら動画がはみ出していた…
そんな場合はワードプレスであればプラグインを
導入すれば簡単に解決することができます。
やり方に関してはこちらの記事を参考にして
動画サイズをレスポンシブにするといいです。
⇒youtube埋め込み動画をレスポンシブにし、スマホ表示でも自動サイズ調整されるプラグイン
