youtubeの動画をブログに埋め込む方法

2019年9月30日

自分のサイトから離れることなく動画を再生させる方法として、埋め込みという方法があります。

ユーザー側からしても、すぐに再生できる点で便利と言えます。

今回は、youtubeの動画をブログに埋め込む方法を紹介します。

pcサイトにアクセス

まずは、youtubeのpc(パソコン)サイトに移動します。

pcサイトへの移動方法がわからない方は下記の記事を参照。

共有→埋め込みコード→コードをコピー→テキストエディタに貼り付け

共有のボタンを押し、埋め込みコードに進み、その内容をコピーします。

そして、ブログのテキストエディタに貼り付ければ完了です。

尚、動画のサイズがwidth560、height315となっており、スマホの画面では大きすぎるので、width336、height189ぐらいにすると良いです。

wordpressの場合、テーマによってはURLのみで埋め込みが可能

wordpressの場合、URLのみで埋め込みが可能な場合があります。

動画のURLをビジュアルエディタにペーストするだけです。

これだけで埋め込まれ、サイズの自動調整もされます。

埋め込み動画がはみ出ないようにする方法

埋め込んだ動画が画面からはみ出さないようにするには、埋め込みコードの最初のiframeの直後にstyle="max-width:100%;"を追加すればOKです。

 

515×315だとスマホの画面でははみ出ます。

 

はみ出ることなく、画面に収まりました。

まとめ

youtubeの埋め込みはとても簡単です。ただ、サイズの調整などについては少し気をつけたいところです。

 

コピペして貼り付ける分には、どのブログであっても同じ作業となります。一度出来れば、他のサイトでも同じようにすればOKです。