WordPressでツイートやInstagram投稿を取り上げるときに便利なEmbed。埋め込み機能のことですが、これについての情報。
目次
WordPressでEmbed(埋め込み）出来るWebサイトと問題点。
埋め込み（Embed）機能はすごく便利です。例えばYouTubeの動画を紹介したい場合、YouTubeのサイトで埋め込みタグを取ってきてもいいですが、Wordpressであれば紹介する動画のURLを行頭から貼るだけでYouTube動画埋め込みが表示されるようになっています。
しかしこの機能も万能ではないようで・・・運用していて解ったそれぞれの埋め込み機能の問題をリストアップします。
全般
どの埋め込み機能でもJavaScriptと連携してリッチな見え方にしているのが一般的。そして埋め込みタグを表示させるとこのJavaScriptのタグが大抵付いています。
しかしこの埋め込みを複数個使う、という話であれば、埋め込みタグに毎回付いているscriptタグのところは1回だけでいいので、例えばよく使う埋め込み機能のScript部分は別の部分、例えばheadに書いておいて都度の埋め込みでは削除、とかしたほうがいいかも。
Google+
Googleが「レスポンシブ推奨」と言ってる割に足元のGoogle+のレスポンシブ化が中途半端なので大変です。
埋め込んだブロックが440px固定
なぜかgoogle+の投稿の埋め込みは440px固定になっています。なのでスマホだとちょっと端が切れて見づらい事が多いです。
投稿者の名前がマルチバイトだと表示されない
Google+の埋め込みURLの構造はこうなっています。
<div class="g-post" data-href="https://plus.google.com/+(投稿者)/posts/(投稿ハッシュ)"></div>
この（投稿者）のところが漢字になっていたりすると、埋め込みタグのダイアログではURLエンコードされているのですが、肝心のGoogle+の埋め込み表示のシステム側がURLエンコードだと表示しなくなっていて、元の投稿者のURLなどからマルチバイトの文字列に再度置き換えないと表示できなくなっています。
embedのパフォーマンスが悪い
WordPressのembedはとても便利で、行頭にURLを貼り付けておくと自動的にembedタグを取得して表示してくれます。
ところがInstagramはこのWordpressとInstagramのサーバ間の通信がパフォーマンスが悪いようで、URLだけの埋め込みを4つか5つぐらいページに入れると処理しきれずにエラーになります。Twitterなどでは起こらないのでInstagramの埋め込み特有の問題と言ってもよさそうです。
回避方法はInstagramのサイトから埋め込みタグを直接取得し、それをWordpressに貼り付けるだけ。embedの変換だけがパフォーマンスが悪いようです。