記事内に動画を埋め込むことで、読者に「文字」や「絵」だけではない案内をすることができます。
また YouTube などを埋め込むことで記事内で動画を見せることができますので、他サイトへの移動・自サイトからの離脱を避け、記事の滞在率を高める効果も期待できます。
ポイント
本記事では、
記事に簡単に動画(mpeg)や、YouTube を埋め込む方法を解説します。
目次
動画の埋め込み
WordPress に埋め込むことができる動画は主に次の2種類です。
- 自分で撮った動画ファイルの埋め込み(サイズ制限あり)
- YouTube 動画の埋め込み
■ 自分で撮った動画のサンプル
スマホなどで撮った動画(形式 mp4)を記事に埋め込んだサンプルです。
記事に動画を直接埋め込む場合は、動画のサイズは WordPress にアップした動画そのままになります(デバイスや画面幅によって適切にファイルサイズが縮小されるわけではない)。
そのためサイトの表示速度が重くなる懸念があるものの、常にクオリティの高い映像を提供することが可能です。
■ YouTube 動画の埋め込み
YouTube の動画を記事に埋め込んだサンプルです。
WordPress にアップできる動画にはサイズの上限がありますので、大きい動画の場合は YouTube にアップして埋め込むことも一つの方法です。
また YouTube の動画は、表示するデバイス、画面幅によって適切なファイルサイズの動画を(’YouTube 側が)表示しますので、サイトの表示速度が重くなりにくい特徴があります。
【サンプル作成中】m(__)m
動画の埋め込み方法
■ 動画ブロックで埋め込む
WordPress では、「動画用のブロック」を利用することで動画を埋め込むことができます。
(画像を表示する場合と同じ感覚です)
- 記事エディタにて 「動画ブロック」 を選択します
- 通常の画像(イメージ)を貼る場合と同様に動画ファイル(mp4)を貼ります
動画ブロックのプロパティで動画再生の設定を行うことが可能です。
項目 | 設定 |
---|---|
自動再生 | ON で自動再生します。 |
ループ | ON でループ再生します。 |
ミュート | ON で音声をミュートします。 |
プレイバックコントロール | ON で、コントロールバー(再生するバー)を表示します。 |
インラインで再生 | ON でインラインで再生します。 |
先読み | 先読みを設定します。 ・ 自動 ・ メタデータ ・ なし |
ポスター画像 | サムネイル画像を設定します。 |
完成です。
ポイント
WordPress のメディア(画像や動画)は(お使いの環境ごとに)最大アップロードサイズが設定されています。
確認する場合は、WordPress の管理画面から 「メディア」 操作にて 「メディアライブラリ」 を表示し、[新規作成] 操作をした場合に画面上の表示 「最大アップロードサイズ:〇MB」を確認できます。
■ YouTube の動画を埋め込む
WordPress の記事作成で用意している YouTube 用のブロックを利用します。
- 記事エディタにて 「YouTube ブロック」 を選択します
- 埋め込みたい YouTube の URL を貼ります
完成です。
■ Videoショートコードを利用する
Video ショートコードを利用することで、動画とは別にサムネイル画像を設定することが可能です。
WordPress のブロックエディタの段落ブロックにそのまま Video ショートコードを書き込んでください。
■ Video ショートコードを利用する場合のサンプル
[video src="https://xxx/xxx/sample.mp4" poster="https://xxx/xxx/sample.jpg"]
poster プロパティで指定した画像を動画のサムネイルとして利用します。
まとめ
WordPress に埋め込むことができる動画は主に次の2種類です。
ポイント
- 自分で撮った動画ファイルの埋め込み
- YouTube 動画の埋め込み
記事に埋め込む動画の種類や方向性で、一番良い方法を選んで利用することが可能です。
WordPress のおすすめテーマ
あなたのブログを強力にアピールし、読者を惹きつける、
魅力的なウェブサイトを手軽に作りたいですか?
そんな方に オススメのテーマが「AFFINGER」 です。
「AFFINGER」テーマを使えば、SEOに強く、集客力がアップし、
上級者でも満足できる、魅力的なウェブサイトが作れます。
ブログアフィリエイトを本気で戦うなら、「AFFINGER」の威力を体感してください。
\ WordPress のおすすめテーマ「アフィンガー」を詳しく見る /

Presented By Boon Boon Blog .Com
広告の設置・収入について
当サイトは Amazonのアソシエイトとして、適格販売により収入を得ています。
当サイトは Google アドセンスを利用し、広告により収入を得ています。
当サイトは ASP が提供するサービスを利用し、広告、適格販売により収入を得ています。