wordpressでリンクの埋め込み

wordpressのバージョン4.4からは本文内でURLをそのまま記述すると、画像や動画などと共に抜粋文をカード状あるいはボックスに入れたような形でパーマリンクを貼ることができるようなっています。また、当初の外部リンクは一部しか対応してなかったようですが、現在では拡張されているようです。このwordpressの埋め込み機能は、基本的に内部リンクに対して利用することがほとんどだと思います。

wordpressのoEmbedとは?

Embedは、埋め込むという意味です。そのためURLではなく、投稿や記事を埋め込むといった表現もされます。oは何を意味しているのですかね。oEmbedそのものはwordpress本家によるとプロトコルと定義しています。いわば通信する際の約束事みたいなものですね。

このoEmbedは、wordpressのバージョン4.4以降なら標準対応になっており、wordpressの投稿画面で、URLを直接記入することで表示されるようになります。その際、URLは一行ごとに区切らなければならないというルールがあります。つまり、二つ連続して記入する場合は、一つのURLを記入したら改行して次の行にURLを記入するといった形になります。

wordpress本家によると、この記述法もショートコードということです。ショートコードといえば、[wordpress]~[/wordpress]や単に[wordpress]といった形で利用することが多いと思います。ですが、短いコードという意味では例えURLであっても、それが意味を持つコードであればショートコードになるのでしょう。ただ、長すぎるURLもあるのでそういったケースでは疑問も出てきますが。ちなみに[embed]~URL~[/embed]という形で記述しても動作します。

oEmbedは内部リンクだと上記の方法で簡単に実装できます。しかし、外部リンクに対しては表示されるドメインもあれば、表示されないドメインもあります。

wordpress本家によると、バージョン4.4からoEmbedの自動探索をサポートしているらしいですが、ホワイトリストに登録されてないサイトから埋め込めるコンテンツの種類には制限があるようです。

oEmbedのメリット

従来のようにAタグのhref属性にURLを設定するのではなく、直接URLを本文に記載するだけでブログカードが出来上がります。利用者はwordpressのアップデートに関係なく、この仕組みが廃止されるまで使うことができます。プラグイン等は、アップデートによって動かなくなる可能性がある一方で、このoEmbedは、wordpressのシステムに組み込まれているため、wordpress本家が提供し続ける限りはこれからも残存します。

oEmbedのデメリット

内部リンクに関しては申し分ないのですが、外部リンクに対しては設定が面倒くさいです。また、この埋め込みコードはiframeを使っているため、ページが開かれるたびに外部リンクを貼っているサイトのサーバへ負荷をかけます。YouTubeなど、巨大なサーバであれば対策が施されているでしょうが、共有のレンタルサーバだと、他のみなさんにご迷惑をお掛けしそうです。弱小サイトなら問題ないと思いますが、人気サイトならあれかも知れません。多分、普通のサイト管理者は普通のリンクでとても喜ぶと思います。

一応、以下のように「.htaccess」で外部サイトから直接、画像などを引っ張れないように設定していてもiframeでサンドボックス化されているため、jpegやgifなどの拡張子には該当せず、すり抜けるようです。拒否する場合はRewriteRuleでサンドボックス化されたURLのembed/#?secretあたりを指定すると良いかも知れません。ただ、せっかくのリンクを拒否するケースはあまり無いと思いますが。

RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(.*?\.)?example.com [NC]
RewriteCond %{HTTP_REFERER} !google\. [NC]
RewriteCond %{HTTP_REFERER} !googleusercontent\. [NC]
RewriteCond %{HTTP_REFERER} !bing\. [NC]
RewriteCond %{HTTP_REFERER} !bingj\. [NC]
RewriteCond %{HTTP_REFERER} !yahoo\. [NC]
RewriteRule \.(jpg|jpeg|png|gif|css|js|css.*|js.*)$ - [NC,F,L]

画像にはアイキャッチを利用しているため、wordpressの記事内に張付けられた画像を読込むことはありません。つまり、記事内で最初に出てくる画像を自動的に取得するという仕組みではありません。アイキャッチ画像がなければブログカードにも画像が表示されません。出てくるのは、タイトルと本文の抜粋です。

wordpressで外部サイトの埋め込み

oEmbedに対応しているサイトであればwp_oembed_add_providerでホワイトリストに追加します。対応していないサイトへはwp_embed_register_handlerを使って登録します。埋め込みを無効化するには、wp_oembed_add_providerを呼び出します。詳しくはワードプレス本家へと言いたいところですが、肝心の設定方法が見当たりません。筆者の場合、当面使う予定もないので、解決にたどり着く前に心が折れました。oEmbedによる埋め込みは、基本的に内部リンクに対してしか使えなさそうです。

結局wordpressの埋め込みより自作ブログカード

ワードプレスの埋め込みリンクは、iframeを使っているためか、フィルタリングにフィルタリングされ、そこに追加のセキュリティ制限が加えられるといったかなりシビアな扱いになっているようです。ワードプレス本体のファイルを分析すれば良いのかもしれませんが、当面使う予定もないので挫折しました。外部リンクがテキストで現れたりリンクで現れたりと不安定です。

自分でワードプレス用のブログカードを作るには投稿記事内のAタグかhttpを検出して配列化します。それにcssやhtmlの装飾と本文の一部抜粋、最初の画像を取り出すといった処理を組み合わせて加工し、できあがったブログカードを元の場所に戻せば完成です。

まとめ

ワープレは操作にある程度慣れてくると十分な機能を提供してくれるのですが、そこは使っていくうちにだんだんと希望が増えてきたりします。そうなると、ワープレを使い込めば使い込むほど、不安定な部分が見えてきたりします。よく分からない動作をワープレがすると調べたり考え込んだりすることと思いますが、普通にプログラムを組むのと違って、バグに近いような状態になっていると無駄に時間を浪費します。

このワープレのoEmbedに関してもそうですね。ワープレ本体からフックや関数の使い方を見つけるほど時間があればよいのですが。筆者の場合はチラ見して何とか楽に解決したいと考えるのですが、大抵ドツボにはまります。引き際が肝心ですね。時間を置いたり寝たりすると、脳内完成する時もあったりしますから。