AJAXを介して投稿コンテンツを読み込むためにモーダルを使用しています。投稿のテンプレートの中に、私はwp_oembed_get()を使ってさまざまな種類のメディア(YouTube、Vimeo、Flickr、そしてInstagram)を埋め込んでいます。 Instagramを除いて、すべてがうまくいっている。
Instagramの埋め込みを含む投稿を開くと、うまく読み込まれます。しかし、モーダルを閉じて別の投稿を読み込もうとすると、埋め込みは正しく機能しません。埋め込み内の写真/ビデオが読み込まれません。
これがページです: http://staging.smuttynose.com/the-hopper
「Instagramテスト」の投稿の1つを開いてそれを閉じてから、もう1つを読み込むと、何が起こっているのかがわかります。
私はこれを考え出すことで私のロープの終わりにいます!
Instagramは埋め込みコードを単なるiframe
からHTMLとJSスクリプトへと変更しました。非常にエレガントではありませんが、私たちにできることは何もありません。 HTMLの一部であるJSファイルが実行されないため、AJAXを介して呼び出されると、もちろんこの設定は失敗します。ありがたいことに、それを2つのステップでAJAXで動作させるための別の公式な方法があります。
このスクリプトをHMTLに含めます。
<script src="//platform.instagram.com/en_US/embeds.js"></script>
AJAXでコンテンツをロードした後にこのJSを実行します。
if ( typeof window.instgrm !== 'undefined' ) { window.instgrm.Embeds.process(); }
それは、Instagramの埋め込みを探し、それらを読み込むということです。頑張って!