こんにちはガルゾウです。
いっぱしのブロガーになるべく日々奮闘しております。
前回はTwitterの埋め込みをできるようになりました。
で、今回はYouTube動画をこのブログ記事内に埋め込む作業をやっていきたいと思います。
果たして綺麗に埋め込むことができるのか？
早速、やっていきましょう。
がるぞうさん、綺麗に埋め込んで読み手を喜ばせてちょうだーい☆
ようし！まかせときんしゃい！
まずは手法を学ぶ
今回、参考にさせていただいた記事は
「無畄井千恵さん」って方の
「WordPressにYouTube動画を綺麗に埋め込む4つの方法」というものすごく分かりやすい記事で勉強させていただきました。（あざっす！）
動画のURLを直接入力する手法
いちばんイージーな手法という説明でしたのでこれから試してみたいと思います。
１、YouTubeチャンネルにログインしチャンネルアイコンを選択
２、アイコンを押すと下の画像のように編集画面が出てくるので、クリエイターツールを選択する。
３、動画を選択or編集ボタンを選択しURLを発行する。
以下のように動画を選択するか
以下のように「編集」を押す。
すると以下のようにURLが発行されます。
４、発行されたURLを直接WordPressのビジュアルモードにて入力。
発行されたURLをコピペするだけで動画がアップされるらしいです。
早速やってみたいと思います↓
どうでしょうか？ちゃんと貼れていて、かつちゃんと再生されていますか？
>わざわざテキストモードで編集しなくとも投稿できるので、WordPress初心者の方には、この方法が一番オススメです。
とのことでしたのでコレはメインで使用していきそうな手法ですね。
動画のコードを直接埋め込む手法
次にやってみるのが動画のコードを直接埋め込むやり方です。
１、コードの取得
まず、掲載したいYouTubeの動画をひらき、共有ボタンを選択。
２、続いて、共有ボタンを選択すると、下記のような画面が出てくるので、埋め込むを選択
３、コードをコピー
埋め込むを選択すると、このような画面に移動するのでコピー。
４、埋め込んでみよう
コードを取得したら、WordPressの画面をひらき、「メディアを挿入/編集」を選択。
続いて「埋め込む」タブを選択し、コードをペースト、OKボタンを押す。
５、埋め込みサイズも変更できちゃう
動画のサイズを「もう少し大きくしたい、逆に小さくしたい」というような場合があるかと思います。
WordPressでは、サイズも簡単にカスタマイズすることができるそうです。
「コードを埋め込む」までの作業までは同じで、その後、一般タブをひらきます。
サイズの変更をするのは、上の画像の赤枠で囲んだ箇所になります。
ここで注意してほしいのが、「縦横比を保存」という項目にチェックが入っていることを確認してください。
この縦横比を固定することで、サイズを変更しても比率を保ってくれるので、被写体が細くなったり太くなったりすることがありません。
チェックが入っていることを確認したら、横幅・縦幅どちらか一方を変更します。
片方を変更すると、縦横比に合わせてサイズが自動的に変更されるようです。
実際にやってみたいと思います↓
今回はイケハヤさんの動画を埋め込んでみましたがどうですか？
ちゃんと埋め込まれていますか？
正直ちょっとサイズの設定の部分があんまわかんなかったですが、試行錯誤が要りそうですね〜。
便利な機能：簡単にレスポンシブ表示できるプラグイン
まずレスポンシブとは？
※PC、タブレット、スマートフォンなど異なるデバイスでも、ユーザーが使用する画面サイズに合わせてページ・レイアウトを最適化する仕組みのことをさします。
WordPressの方でレスポンシブの設定をするだけで、縦横比はそのままに、ユーザーのデバイスにサイズを合わせてくれるそう。
なんやね〜ん、すげー便利なプラグインあんじゃんw
近年ではスマートフォンでWebを見るユーザーが大多数を占めるため、レスポンシブ対応は必須です。とのこと！
はい、すぐ入れます！
簡単にレスポンシブ表示できるプラグイン
このプラグインを使用することで、YouTube動画が簡単にレスポンシブで表示されます。
プラグインのダウンロード・設定方法
1.まず、ダッシュボードのプラグインを選択
2.プラグイン新規追加ボタンを選択
3.次に、検索窓で今回のプラグイン「YouTube」と検索
4.今すぐインストールを押す
5.プラグインを有効化する
6.ダッシュボードでインストール済みプラグインを選択
7.プラグイン「YouTube」のsettingsを選択
8.Responsive Video Sizingにチェックを入れ、Responsive for all YouTube videosを選択⇒変更を保存で完了（下記画像をご覧ください）
プラグイン入れてみたので実際に動画を貼ってみますね。↓
マナブさんて方の動画を貼ってみましたがスマホでもいいサイズで表示できていますか？
まとめ
実際、やってみましたが正直まだちゃんと貼れているのか？みなさんからきちんと表示できているのか？が不安ですが、これからも活用して読みやすい記事、伝わりやすい記事として動画を埋め込んで行けたらと思います。
ぜひ、動画埋め込んだことがない人のためになったら幸いです。
では、また。
最近のコメント