WordPressの投稿に動画を埋め込む方法

WordPressで動画を挿入する方法はとてもカンタン。

コンテンツに動画を入れる方法はいくつもあるのですが、中でも分かりやすく一番簡単な方法はyoutubeの動画を使う方法です。

動画はコンテンツの理解度を格段に高める事ができる要素。

文章だけのコンテンツに比べて動画コンテンツはお客さんの滞在率が伸びる傾向があります。

お客さんの滞在率が延びれば延びるほどコンテンツの信頼度は上がります。

お客さんの興味を惹くだけで無く、

• コンテンツをビジュアルで理解できる
• コンテンツを補足できる

といった動画を挿入することで、コンテンツの価値は高まります。

動画は必ずしも自分で作る必要はありません。

youtubeなどからコンテンツを補強できる動画を探し、組み込むだけでも十分な効果があるので、積極的に動画を埋め込むようにすると良いと思います。

• 動画を埋め込む2つの方法
• 動画をカンタンに埋め込めるサイト一覧

動画を埋め込む2つの方法

画像を埋め込むには2つの方法があります。

• コピペで埋め込めるカンタンな方法
• 画像サイズを指定したい場合に使う方法

どちらもWordPressならではの機能で、動画の埋め込みをカンタンに行えます。

コピペで埋め込めるカンタンな方法

WordPressはURLをコピペするだけでビデオを埋め込めるという特殊な機能が備わっています。

どれだけカンタンかというと、投稿画面のエディタに、

YoutubeのビデオのURLをコピーして、

貼り付けるだけ。

すると、一瞬でビデオが埋め込まれます。

画像サイズを指定したい場合に使う方法

とても便利で簡単な動画埋め込み機能なのですが、一つだけ欠点があります。

それは、細かい設定ができないということです。

例えば「動画サイズ」。

普通に使うのであればほとんど問題はありませんが、特殊な事情やレイアウトが崩れてしまう関係で動画サイズを調整したいと思うことが出てくる事もあります。

そんなときには上のコピペ動画埋め込みを使う事ができません。

そのような場合には、「ショートコード」を使います。

ショートコードの細かい説明は後からしていきますが、簡単に言えば、 []（括弧）で囲むことで様々機能を実行できるWordPressの機能という感じです。

動画の場合は、

のように、

1. カッコとカッコの間にyoutube動画をコピペして
2. 横幅の数値（width）と縦幅の数値(height）を設定

することで埋め込み動画のサイズを変更することができます。

• 横幅だけ指定(width=”200″)
• 縦幅だけ指定(height=”100″）

でも設定が可能です。

動画をカンタンに埋め込めるサイト一覧

WordPressに動画をカンタンに埋め込めるサイトで日本に馴染みがあるのは

• Youtube
• Vimeo

の2つです。

ですので、特殊な事情がない限りはビデオはYoutubeを使うのがカンタンです。

WordPressがURLだけで動画を埋め込める理由

少しだけ技術的な話をすると、WordPressではメディアの埋め込みに「oEmbed」という仕組みを使う事ができるので、URLだけでメディアをカンタンに埋め込む事ができるのです。→ oEmbed（WordPress公式）

eEmbedとは複雑な埋め込みコードであるHTMLを、メディアサイトから自動的に取得できるプロトコル。

カンタンにいえば、URLをコピペするとあなたのサイトがYoutubeに埋め込みコードを問い合わせて勝手にHTMLを埋め込んでくれるというわけです。

かなり便利です。

とはいえ、どんなサイトからでもあなたのサイトにHTMLコードを埋め込めてしまっては困るので、WordPressでは信頼できるサイトをホワイトリスト（安全なサイト）として、限定的にこの機能を提供しているという仕組みです。

日本で馴染みあるサービスでは、Youtubeの他にもFlickr、Instagram、Twitterなどがホワイトリストに入っているのでこの機能を使うことができます。 → 埋め込み機能が使えるホワイトサイトリスト

埋め込み可能なメディアサイト一覧

oEmbed（URLで埋め込み）が可能なホワイトリストサイト一覧はこちらです。

サービス	埋め込みの種類	WPバージョン
Animoto	動画	WordPress 4.0
Blip	動画	WordPress 2.9
CollegeHumor	動画	WordPress 4.0
DailyMotion	動画	WordPress 2.9
Flickr	動画 & 画像	WordPress 2.9
FunnyOrDie.com	動画	WordPress 3.0
Hulu	動画	WordPress 2.9
Imgur	画像	WordPress 3.9
Instagram	画像	WordPress 3.5
iSnare	記事	WordPress 2.9
Issuu	ドキュメント	WordPress 4.0
Meetup.com	各種コンテンツ	WordPress 3.9
EmbedArticles	各種コンテンツ	WordPress 3.9
Mixcloud	音楽	WordPress 4.0
Photobucket	画像	WordPress 2.9
PollDaddy	投票・アンケート	WordPress 3.0
Rdio	音楽	WordPress 3.6
Revision3	TV shows	WordPress 2.9
Scribd	ドキュメント	WordPress 2.9
SlideShare	プレゼンスライド	WordPress 3.5
SmugMug	写真	WordPress 3.0
SoundCloud	音楽	WordPress 3.5
Spotify	音楽	WordPress 3.6
TED	動画	WordPress 4.0
Twitter	ソーシャルメディア	WordPress 3.4
Viddler	動画	(4.0 で非推奨)
Vimeo	動画	WordPress 2.9
Vine	動画	WordPress 4.1
WordPress.tv	動画	WordPress 2.9
YouTube	動画	WordPress 2.9

（→ 公式WP Codex）