
Webコンテンツ&WordPressクリエイターのRuiです!
記事を執筆していると、文章や画像だけではどうしても伝わりきらない場合がありますよね。
そのようなときに動画を記事に載せておくと読者に伝わりやすく、またサイトの滞在時間も延びます。
それなのに、YouTubeの動画をブログに埋め込んだら、スマホで見るとはみ出ていて全部見られない!
動画を見てほしくて埋め込んだのに、見切れているせいで「ダサい」という印象を与えてしまったら、渾身の記事が台無し。
YouTubeの動画がはみ出る要因は、動画を共有、または右クリックして「埋め込みコードをコピー」した時に、動画のサイズが指定されてしまうから。
そのため、画面が縦に長いスマホで見ると画像がはみ出してしまうのです。
読者にはPCでもスマホでも綺麗なレイアウトで見てほしいじゃないですか?
そこで、簡単に画像のはみ出しを予防できる方法を紹介します。
「はみ出しを予防するって言っても、CSSをいじったりするんでしょ?そんなのできないよ!」
「WordPressを始めたばかりだから、そんなこと言われてもワケがわからない」
そんなあなたでも大丈夫。
設定は簡単にできますので、ぜひやってみてくださいね♪
iframeを使って画面からはみ出ない動画埋め込みをする
1.ダッシュボードから「外観」→「カスタマイズ」を選択

2.追加CSSをタップ

4.赤枠の部分に『iframe{width:100%;}』と入力後、「公開」をタップ

※iframeの横幅を100%に設定することで、動画のはみ出しを予防できます。
まとめ

最後まで読んでいただき、ありがとうございます。
YouTubeの埋め込み動画をはみ出さずに表示させる方法はいくつかありますが、この方法はすごく簡単。(※iframeはコードが重いので表示速度が落ちたら消してください)
WordPressでコードを1つ追加するだけです。
プログラミングなんてわからない!そんなあなたでもすぐに設定できますよ。
動画を埋め込むときは、ぜひこの設定をしてみてくださいね。
この記事へのコメントはありません。