元社畜サラリーマンが副業から月収1000万円稼ぎ脱サラし、わがままに自由に生きるブログ

埋め込み動画を超簡単にレスポンシブ対応（横幅自動最適表示）にする方法

2016.03.29

どうもshinyaです！

 

自身のブログなどでYouTubeの動画を埋め込んだ時、
スマホで見たり、2カラムから3カラムに変更した時など
動画が枠よりはみ出したりしますよね。

 

テンプレートを一新した時などにも知らぬうちに
こういったことが起こると思います。

 

今回はYouTubeなどの動画を自分のブログに
埋め込む際に一手間加えることによって
超簡単にレスポンシブにする方法をお伝えします。

 

物凄く簡単なので、今後動画を埋め込む際は
このやり方をぜひ実践してみてください。

 

埋め込み動画を超簡単にレスポンシブ（横幅自動最適表示）のやり方

 

埋め込みたい動画の埋め込みコードをコピーして貼り付けます。

 

すると下記のようになると思うので、

<iframe width=”854” height=”480″ src=”https://www.youtube.com/embed/43XXXXeiTNo” frameborder=”0″ allowfullscreen></iframe>

横幅の数値の箇所（黄色部分）を100%に書き換えます。

 

width=”100%“

 

100%

こちらをコピーして”と”の間に貼り付けて見てください。

 

これだけで終わりです。

 

これをすることによってどんな状況であっても
横幅MAXの状態で動画を表示してくれるようになります。

 

縦幅は、一度横幅を100%に設定してみてから
比率を調整してみてください。

 

動画ではなく画像も自動ではみ出ないように
レスポンシブにしたい場合は下記を参考にして
ください。

 

画像も物凄く簡単にできます。
スマホ表示とPC表示の画像の大きさを自動で最適表示させる方法

【当サイト訪問者様へ今なら初心者用アフィリエイト教科書を無料プレゼント中！】

入手される場合は下記をバナーをクリック！※ダウンロード者数4500名突破！ コンテンツバナー

【当サイト訪問者様へ今なら初心者用アフィリエイト教科書を無料プレゼント中！】

入手される場合は下記をバナーをクリック！※ダウンロード者数4500名突破！

コンテンツバナー

関連記事

トップページに戻る

完全無料の正統派アフィリエイト通信教材

ASE教材2
 

【AFFILIATE SUCCESS EDUCATION】は有料教材を超える内容など数多くのアフィリエイターから絶賛されました。第17回e-book大賞にて約4万4000作品の中から【優秀賞】を受賞。

ebook17

まずは月収10万円から目指しませんか？

あなたをレクチャーする動画本数は80本以上で総コンテンツ量100以上の超有料級の無料正統派アフィリエイト教科書。

⇒無料ダウンロードはこちら

管理人：shinya

cropped-shinya2.png

当サイト管理人shinyaです。

激動の社畜サラリーマン人生にピリオドを打ち、現在PC1台でインターネットビジネスを行い、0から約2年で月収1500万円を稼ぐところまで到達し、さらに1年後には月収3200万円まで数字を伸ばす。現在目覚まし要らずの自由な生活している36歳。

主な活動：ビジネスコミュニティ運営、WEBマーケティングコンサル、ブログコンサル（アクセスアップ・SEO）

とにかく誰からも干渉されないストレス0のライフスタイルに徹底的にこだわり、且つ一度キリの人生もう少しわがままに生きてもいいじゃね？的な自由LIFEを満喫中。コンサルティングにおいてはサラリーマンから主婦まで多くの仲間を絶賛稼がせ中。

詳しいプロフィールはこちら

shinyaの実績

2014年11月　副業でアフィリエイト開始
2015年03月　月収25万円突破時に脱サラ
2015年04月　情報発信ビジネス開始
2015年11月　月収200万円（プロモーション）
2016年03月　月収100万円（自動化）
2016年03月　e-book大賞優秀賞受賞
2016年12月　月収1500万円（プロモーション）
2017年05月　月収200万円（自動化）
2017年09月　月収400万円（自動化）
2017年12月　月収3200万円（プロモーション）

shinyaの指導者としての実績

【漫画】shinyaの社畜脱出ストーリー

漫画LPバナー

いつも応援ありがとうございます！

にほんブログ村 小遣いブログ アフィリエイトへ
にほんブログ村