2016/03/09 2018/03/29
Youtubeを埋め込んでレスポンシブ対応にするにはEmbed Responsivelyが便利!
スポンサーリンク
こんにちは、フリーランスパパの神田翼(@tsubasa_lsc)です。
久々になってしまいましたが、便利な情報を書いておきます。 どうも、WEBデザイナーの翼(@lsc_design)です。 ブログや、WebサイトにYoutubeの動画を埋め込んでいる方は多いと思います。 埋め込むのも簡単で、誰でもできます。 ただ、あのYoutubeが!あの!Youtubeが! 埋め込み動画は、レスポンシブ対応してなんですね。 なんでなん!?といつも思っていますが、僕があーだこーだ言ってもどうしようもないので、 便利なツールを発見しました。埋め込み動画をレスポンシブ対応に!Embed Responsivelyが便利
Embed Responsively このサイトにアクセスして、Youtube動画の該当ページのURLをコピー&ペーストすれば、 勝手にレスポンシブ用のコードが生成されるので、そのコードをページ内に貼ってしまえばOKです。 簡単ですね。一応、やり方も書いておきますね。1.埋め込みたい動画のURLをコピーする

2.ページを開き、コピーしたURLをペーストする
Embed Responsivelyにアクセスする
3.生成されたコードをコピーする

4.コピーしたコードを該当ページに貼り付ける

レスポンシブ対応の動画を貼ってみます
画面幅を手動で変えてみてください。一緒に動いて変わると思います。 便利なので使ってみてください。 以上。スポンサーリンク