動画をワードプレスに埋め込む方法を解説1

marketing

2020年07月27日(公開: 2020年07月27日)

ワードプレスへの動画の埋め込みする2つの方法を解説

ワードプレスのブログに動画を埋め込んでみたいけど、やり方が分からないケースも多いのではないでしょうか?ワードプレスなら複雑な作業をしなくても簡単に動画を埋め込むことができます。

この記事では、youtube動画やその他の動画を埋め込む手順と動画を埋め込む場合の注意点を解説しています。

ワードプレスに動画を埋め込む方法

動画をワードプレスに埋め込む方法を解説2

ワードプレスに動画を埋め込む場合、youtube動画とその他の動画によって方法が異なります。

 以下でそれぞれの方法をお伝えしています。youtube動画とその他の動画、両方の埋め込み方法を覚えておくと便利です。

動画ファイルをアップロードする場合

まずは、youtube以外の動画をワードプレスへアップロードする方法をお伝えします。自分で撮影した動画やローカルに保存した動画をアップロードする方は、以下の方法を参考にしてください。

作業は非常に簡単ですが、サイズが大きいとアップロードできない点には気を付けましょう。

「メディアを追加」からアップロード

ワードプレスにログインし、投稿画面を開きます。

編集部分にて動画を追加したい箇所をクリックします。

ワードプレスへの動画埋め込み1次に、「メディアの追加」をクリックしてください。

ワードプレスへの動画埋め込み2

「メディアを挿入」という画面が開くので、「ファイルをアップロード」のタブから「ファイルを選択」をクリックします。ローカルフォルダから目的の動画ファイルを選択してください。

ワードプレスへの動画埋め込み3

投稿に挿入

動画ファイルがアップロードできると、「メディアライブラリ」タブの一覧の中にファイルが現れます。

ワードプレスへの動画埋め込み4

右下の「投稿に挿入」を押すことで、先ほど編集部分でクリックした箇所に動画を貼り付けることができます。

ワードプレスへの動画埋め込み5

アップロードできる動画形式とファイルサイズ

ワードプレスにアップロードできる動画形式は次の通りです。

・MPEG4形式:mp4、m4v
・MPEG1形式:mpeg、mpg、mpe
・Microsoft動画形式:asf、asx、wax、wmv、wmx
・Windows標準動画形式:avi
・Apple動画形式:mov、qt
・DivX圧縮動画:divx
・Flash動画:flv
・その他:ogv、mkv
※3gp形式の動画ファイルはアップロード不可

ワードプレスにアップロードできるファイルサイズの上限は、初期設定値で30MBです。ファイルサイズの基準としては、仮にAndroidのスマホで動画を撮影した場合、720pの画質で1分あたり約40~45MBになります。

もしファイルサイズの上限を上げたいなら、ワードプレスのPHP設定ファイルである「php.ini」で以下の部分を変更してみましょう。

・memory_limit = 256M
・post_max_size = 50M
・upload_max_filesize = 30M(例:50Mにしたいなら30Mを50Mに変更)

ただし、上限を上げすぎるとサーバーの負荷が増し、Webサイトが重くなることもあるので注意してください。

youtube動画を埋め込む場合

ワードプレスにyoutube動画を埋め込むには、「URLを埋め込む方法」と「コードを取得して埋め込む方法」の2種類の方法があります。

URLを埋め込む方法がより簡単ですが、動画サイズを変更できない点にだけ注意しましょう。

URLを埋め込む方法

まずは、ワードプレスに埋め込みたい動画ページをyoutubeで開いてください。

その動画ページのURLをコピーします。

youtube url埋め込み1

後はワードプレスの投稿画面で、自由な場所にURLを貼り付けるだけです。

youtube url埋め込み2

埋め込んだ動画は編集中でも確認することができます。

コードを取得して埋め込む方法

先ほどと同じように、youtubeの動画ページにアクセスします。

動画の下にある「共有」というボタンを押します。

youtubeコード取得埋め込み8

以下の画面が表示されるので、「埋め込む」のボタンをクリックしてください。

youtubeコード取得埋め込み9

下画像のように動画の埋め込みコードが表示されます。埋め込みコードを取得するには、そのまま画面下の「コピー」を押すだけです。

youtubeコード取得埋め込み10

次にワードプレスの投稿画面を開いてください。

youtube動画を埋め込みたい箇所をクリックします。

youtubeコード取得埋め込み2

ビジュアルエディタのメニューにある「挿入」を選択します。

youtubeコード取得埋め込み3

「挿入」の中にある「メディア」をクリックします。

youtubeコード取得埋め込み4

すると、「動画を挿入/編集」画面が表示されますので、タブの「埋め込む」をクリックします。「埋め込みコードを以下にペーストしてください。」の枠へ、先ほどコピーした埋め込みコードを貼り付けましょう。

youtubeコード取得埋め込み5

後は「OK」を押すと、先ほど投稿画面でクリックした箇所にyoutube動画を貼り付けることができます。ただ、「OK」を押す前に、必要であれば動画サイズの設定を行っておきましょう。

youtube動画の設定

先ほど「メディアの挿入/編集」で埋め込みコードを貼り付けた画面から、今度はタブの「一般」をクリックします。

youtubeコード取得埋め込み6

「一般タブ」では、以下のように動画サイズの設定が可能です。必要であれば縦横比を変更したうえで「OK」を押してください。

また、youtube動画は任意の開始時間を設定することもできます。

設定は、埋め込みコードを取得する際に、「開始位置」の項目へ任意の時間を入力するだけです。以下のように秒数を指定しておくと、ワードプレスに埋め込んだ際に指定開始時間から動画がスタートします。

youtubeコード取得埋め込み11

プラグインを利用する方法

ワードプレスにyoutube動画を埋め込むときは、プラグインを活用すれば動画を見やすくしたり、読み込み速度を高めることができます。

便利なプラグインは次の3種類です。

・youtubeプラグイン:動画をレスポンシブ表示できる
・Embed Plus for YouTube:ギャラリーやプレイリストが作れる
・WP YouTube Lyte:動画の読み込み速度を高める

プラグインを利用する場合は、ワードプレスのメニューにある「プラグイン」から「新規追加」を選択し、上記プラグイン名で検索してください。インストールした後に有効化することでプラグインが利用できます。

ワードプレスに動画を埋め込む場合の注意点

動画をワードプレスに埋め込む方法を解説3

ワードプレスに動画を埋め込むときは、動画の配置や著作権についても覚えておきましょう。特に、権利の侵害は大きなトラブルに発展することもあるため、十分に気を付けてください。

動画の配置を変えたい場合

ワードプレスに埋め込んだ動画の配置を変える場合、クラシックエディタ(旧エディタ)と新エディタで方法が異なります。

クラシックエディタの動画の配置を変更する方法

クラシックエディタの場合、まず埋め込んだ動画の直前にポイントを配置します。

ワードプレスの動画配置2

編集ツールにある「左寄せ」「中央揃え」「右寄せ」のいずれかを選択してください。すると、選んだ設定に応じて動画の配置が変わります。

ワードプレスの動画配置3

新エディタの動画の配置を変更する方法

新エディタでは、ワードプレスで動画のブロックを選択するとツールバーが表示されます。その中に「左寄せ」「中央揃え」「右寄せ」のアイコンがあるので、必要に応じて使用してください。

ワードプレスの動画配置1
著作権に抵触する可能性

ワードプレスに動画を埋め込む際は、著作権に抵触しないものを利用することが基本です。

たとえば、テレビ番組を録画して、テレビ局に許可なく投稿している動画は違法アップロードにあたります。安易に違法アップロードの動画をワードプレスに埋め込んでしまうと、著作権に抵触する可能性があるので注意してください。

音楽や映像には必ず著作権があります。埋め込みコードをコピーする際の条件を記載している企業もあるため、動画の概要欄などはよく確認しておきましょう。

まとめ

ワードプレスに動画を埋め込む方法は、youtube動画とそれ以外の動画で大きく異なりました。どちらにも一長一短があるため、ご自身に合う方法で埋め込むようにしましょう。

動画の埋め込みに慣れてくると、今度はプラグインの利用もご検討ください。プラグインを活用することで動画の見栄えが良くなったり、ユーザビリティの向上にも役立ちます。

プロクオリティの動画をだれでも簡単に作れる「RICHKA」

RICHKAを使えば、だれでも簡単にプロクオリティの動画を作れます!

RICHKAは「Yahoo! JAPANクリエイターズプログラム」公式ツールに採択されており、Yahoo! JAPANや日経ビジネスなど、広告代理店や大手メディアをはじめ400社以上の企業様にご愛用いただいております。

動画制作の時間やお金などのコストでお悩みの方は、まずはお気軽に資料をダウンロードしていただけますと幸いです。

資料をダウンロードする

この記事をシェア