アフィリエイト

YouTube動画をブログに埋め込みスマホではみ出るサイズを防ぐ方法

youtube

文章の説明だけではなく、画像や動画を盛り込むことで、より魅力的なコンテンツを作成することができますよね。

YouTubeの動画も簡単にブログ内に埋め込むことができます。

「共有」「埋め込みコード」のどちらかを選択し、指定のコードをブログにコピペすることでそれが可能になります。

c4e71d7413709de8b08089435a739108

                

b3451797f8773c27ff10e76749cfee99

ただ、動画によって(ブログやテンプレートによって)はスマホでみたときに、このように画面からはみ出てしまうことがあります。

IMG_1823

これではせっかく良いコンテンツを作れたとしても読者は動画を見る気にはならないですよね。

これを防ぐためには、貼り付けたいコードを以下のタグで囲みます。

<div class="v-wrap al-c m30-b">貼り付けたいコード</div>

                

89ab9e53b5366717437f2d31dc562a3a

そうすると・・・

IMG_1824

ご覧のようにスマホでも最適化することができました。

僕の場合はこのブログだとスマホ最適化ができませんでしたが、So-netブログでは自動的にサイズが縮まりました。

ブログ内に動画を埋め込んでいる人は、一度スマホではどのように表示されているのかをチェックしてみるといいかもしれませんね。

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です