WordPressでブログ始めたんだけど、YouTubeの埋め込みの方法がわからない。簡単な方法が知りたい。
この記事では、ワードプレスで簡単にYouTubeを埋め込む方法を解説します。
記事でYouTubeの埋め込みを簡単に実行したいですよね？
埋め込むにも様々な方法があるんですが、ワードプレスは2019年に新エディタのグーテンベルグ（Gutenberg）をリリースしています。旧エディタのクラシックエディタのサービス提供は、2021年12月31日に終了予定です。なので、グーテンベルグの埋め込む方法をメインに解説していきます。
✔️この記事で得られる情報
- グーテンベルぐのブロックエディタで埋め込む
- カスタムHTMLで埋め込む方法
- 埋め込み利用のポイント
【Wordpress】YouTube動画を埋め込む簡単な方法
記事を作成する際に、記事内容の信憑性を上げる為にYouTubeの埋め込みを利用する事が増えてきましたね。
今までは、AddQuickTagなどのプラグインを利用、HTMLを直接入力して埋め込むなどの方法で行われてきました。
グーテンベルグになり、ブロックエディタの機能でYouTubeの埋め込みができるようになっていますので手間がかからず非常に便利です。レスポンシブ対応していますので様々なデバイスでの視聴にも対応しているのも良い点です。
それではここからは、実際にYouTubeを埋め込むやり方を解説していきます。
レスポンシブ対応とは、PCやスマホなど様々なデバイス（周辺機器）のどれで見ても画面の大きさに比例されたデザインで見やすく変更される仕組みです。
グーテンベルク（ブロックエディター）でYouTubeを埋め込む
手順は以下の通りです。
とても簡単なので覚えてガンガン利用しましょう。
このやり方は、レスポンシブ対応しています。
ブロックエディター画面でやり方を説明します。
＜ブロックエディターで埋め込む手順＞
- ブロック追加ボタンを押してメニューを呼びだす
- 埋め込みメニューを開きYouTubeを選ぶ
- 検索窓にURLをコピペする
- 埋め込み完了し動作確認する
①ブロック追加ボタンを押してメニューを呼び出す
手順①：写真のブロック追加のボタンをクリックします。
クリックするとブロックメニューが呼び出されます。
②ブロックメニューの【埋め込み】を開きYouTubeを選ぶ
手順②：埋め込みを選択し
YouTubeの項目をクリックしましょう。
③YouTubeリンクを貼り付けする
手順③：リンクを貼り付ける
YouTube画面で貼り付けたい動画のURLを取得します。
「埋め込むYouTube動画の共有クリック → コピーをクリックして取得 → 埋め込みにURLを添付」これで埋め込み完了！
④埋め込み完了し動作確認する
ジュンイチの【デジマ研究所】
グーテンベルグの解説動画を実際に埋め込んでみました。
（この動画解説でグーテンベルクの新機能が把握できます。）
手順④：埋め込み完了後の動作確認
YouTube動画を埋め込む事ができたら、実際の動作確認をしましょう！これで埋め込み簡単にできましたね！
カスタムHTMLでYouTubeを埋め込む方法
ここでは、カスタムHTMLでYouTubeを埋め込む方法を解説します。
直接HTMLで埋め込む方法です。
＜HTMLで埋め込む手順＞
- ブロック追加ボタンを押してメニューを呼びだす
- カスタムHTMLメニューを選ぶ
- YouTubeからHTMLコードをコピペする
- 埋め込み完了し動作確認する
①ブロック追加ボタンを押してメニューを呼びだす
手順①：写真のブロック追加のボタンをクリックします。
クリックするとブロックメニューが呼び出されます。
②カスタムHTMLメニューを選ぶ
手順②：フォーマットを選択し
カスタムHTMLの項目をクリックしましょう。
③YouTubeからコードをコピペする
手順③：コードをコピペする
YouTube画面で貼り付けたい動画のHTMLを取得します。
「埋め込むYouTube動画の共有クリック →埋め込み → HTMLコピーをクリックして取得 → カスタムHTMLにURLを添付」これで埋め込み完了！
このような流れで行います。
私はHTLMを添付ではなく、埋め込みを活用しています。
理由は、
簡単でレスポンシブ対応だからです。
👇はHTMLで直接埋め込みの結果です。PC画面で見ると直接埋め込みの方が、小さく埋め込まれてしまいます。
まとめ：YouTube動画を埋め込む簡単な方法
はいっ！これでYouTubeを簡単に埋め込む方法を紹介しました。
自身のブログサイトや、HPなどYouTubeを埋め込む機会は必ずきますので、この方法でサックと設定してしまいましょう。
✔️サイト運営しているなら、ブログアフィリエイトおすすめツール8選【動画で使い方をレクチャー】で使えるおすすめツールを知る事ができます。
✔️テレワーク向けなどブログアフィリエイト用おすすめパソコン5選！損しない選び方【2020年最新】でPCの選び方がわかります。
コメント