ワードプレスでYouTube動画を挿入する2つの方法


今回はワードプレスでYouTubeの動画を挿入する方法を紹介します。

2つの方法があるので、両方とも紹介していきます。

どちらも簡単な方法ですので、今回の記事を参考に動画の挿入方法をマスターしていってください。

YouTube動画を挿入する方法

それでは、YouTube動画を挿入する方法ですが、簡単な方法から先に紹介します。

1.共有リンクで導入

まず、YouTubeのページに飛びます。

動画ページの下を見ると、「共有」というボタンありますので、ここをクリックします。

1

URLが表示されるのでこれをコピーし、ワードプレスにそのまま貼り付けます。

すると、自動的に動画に変換されます。

2

たったこれだけでYouTube動画挿入の完了です。

この方法で動画を挿入した場合、自動的に動画サイズが最適化され、スマホでもきれいに表示されます。

3

動画開始位置の調整

また、共有リンクの下に「開始位置」というのがありますが、ここをいじることで好きな位置から動画を再生させることができます。

4

2.埋め込みコードで挿入

2つ目の方法は、埋め込みコードを使った動画の挿入方法です。

こちらの方法は共有リンクを使った挿入方法より一手間かかりますが、もう少し細かい設定ができるようになります。

先ほどと同様に「共有」を押したあと、共有の隣に「埋め込みコード」というタブがありますのでここをクリックします。

5

埋め込みコード用のオプション

そして「もっと見る」をクリックすると、動画サイズやコントロールの表示/非表示が設定できます。

6

設定ができたら先ほどと同じようにコードをコピーしてワードプレスに貼り付けるのですが、必ず「テキストエディタ」に切り替えてからコードを貼り付けます。

ビジュアルエディタのままコードを貼り付けても動画が挿入されませんので、ここは注意してください。

7

テキストエディタで埋め込みコードを貼り付けたあと、ビジュアルエディタに切り替えると動画が表示されます。

ただ、動画サイズを大きなサイズで指定した場合、ページからYouTube動画が見切れてしまうことがあるのでプレビューで確認しながら作業を進めていくといいです。

その他の小技

以上、YouTube動画を挿入する2つの方法を紹介しました。

動画を右クリックでダイレクトにコードを取得

今回は動画リンクをYouTubeの公式サイトから取得しましたが、ブログなどに埋め込まれている動画なら、右クリックからダイレクトにコードを取得することもできます。

8

動画を中央寄せする方法

動画を挿入するときは共有リンクから動画を挿入する方法さえ覚えておけば十分ですが、実はこの方法だと動画を中央寄せすることができません

動画を中央寄せしたい場合は埋め込みコードを利用し、<center>タグで埋め込みコードを囲う必要があります。

  • <center>埋め込みコード</center>

すると、こんな風にYouTube動画をセンタリングできます。

9

見栄えにこだわりたいときはこちらを使ってみてください。