WordPress バージョン4.4以降から、記事のリンクURLを直接入力するだけでアイキャッチやリンクの詳細を誰でも簡単に引用が行えるよう、oEmbed規格を採用しました。
12
実際に記事を埋め込みしてみます。

———-埋め込みここから———-

———-埋め込みここまで———-

URLをコピペするだけで上記のように綺麗に埋め込みリンクを生成してくれます。

この機能、使いこなすと凄く便利なのです。しかし

喜んだのもつかの間・・・・実はこの便利機能には罠がありました。

それは、スマホで回覧するとレスポンシブ化されないという問題です。

kkld

おいっ!画面切れてるやんけ!!!

ソースを見てみるとどうやらテーマ自体にコード修正を加えないとレスポンシブ表示ができないようです。

実は1年ほど前にもyoutubeがoEmbed規格に対応したことでWordPress記事内でURLのみで動画を挿入できるようになっておりましたがこちらも結局レスポンシブ表示させるためにはコードの修正が必要でした。

せっかくなので弊社でoEmbedで埋め込んだコンテンツをレスポンシブ化するプラグインを作ってみました。

oembed-responsive導入方法

以下からダウンロードを行い、プラグインとしてWordPressに直接インストールしてください。それ以外の設定は一切必要ありません。

プラグインを導入することで以後対応サイトのURLを挿入するだけで以下のようにテキストや写真がレスポンシブ対応になります。

レスポンシブ

注意
プラグインを導入する以前のページにはレスポンシブ化は効きませんのでその場合は再生成をしてください。

多くのwebサービスに対応しています。

その他以下のwebサービスにも対応しているはずです。(oEmbed統一規格なのでたぶん大丈夫です。全ての確認はしておりませんのでご了承ください)

  • twitter
  • youtube
  • Dailymotion
  • Vimeo
  • Instagram
  • hulu
  • Flickr
  • SlideShare
  • Imgur