私は次のような流星にTwitterウィジェットをロードしようとしています:
<blockquote class="twitter-tweet" lang="en"><p>"Curiosity Finds Iron Meteorite on Mars" <a href="http://t.co/qh6f1ITd7b">http://t.co/qh6f1ITd7b</a></p>— Daniel Fischer (@dfischer) <a href="https://twitter.com/dfischer/statuses/489240003927887872">July 16, 2014</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
しかし、これは平文としてロードされます。
パッケージを作成してみました:
Package.describe({
summary: "External script"
});
Package.on_use(function (api) {
api.use(['templating'], 'client');
api.add_files('widget.html', 'client');
});
widget.htmlには次のものがあります。
<head><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></head>
しかし、運がありません。これを機能させる方法について何かアイデアはありますか?
テンプレート(widgetTemplateと呼びましょう)で、ウィジェットをレンダリングする必要がある場所で、次の関数を使用します(安全のためにtry / catch)。
Template.widgetTemplate.rendered = function () {
try {
twttr.widgets.load();
} catch (e) {}
}
同じことがFacebookウィジェットにも使用できます(共有など)- FB.XFBML.parse()
ヘッドにwidgets.jsがロードされていることを確認してください-syncまたはasync。
非同期ロードの場合は、「head」で次のコードを使用します。
<script>
! function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");
</script>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加