私は新しいページに特定の投稿を表示するときにfbのようなgoogle +1、tweet-buttonなどを追加したいと思います。私は、例えばaddthisがデフォルトでこれを提供していることを知っています。しかし、欠点は、あなたが多少の大きなJavaScriptファイルを取得して、時にはいくつかのエラーをスローすることです。だから私の質問です:あなたは通常、どのようなオプションと同様のシナリオで行くのですか?ありがとうAdd/ShareこのVSは「手動で」各ボタンを追加します
3
A
答えて
4
私はソーシャルボタンを含めるのが私の好みの方法ではありません。実際に気づいたように、いくつかのエラーがスローされ、追加のライブラリが失敗した場合(例えばJavaScriptエラー、サーバのタイムアウト...)すべてボタンはユニークなライブラリに依存しているため失敗する可能性があります。さらに、パフォーマンスの単純な問題のために、addthisは他のスクリプト(gzipされた33kb)を読み込んで回避することができるスクリプトであり、ソーシャルボタンを完全に管理することができます。
私は負荷非同期ですべての必要なライブラリを好むと loadscript
があるこの
$(document).ready(function() {
if (('.socialshare').length) {
/* twitter button */
$('<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>').appendTo($('.socialshare'));
loadscript('//platform.twitter.com/widgets.js', 'twitter')
/* Google +1 button */
$('<div class="g-plusone" data-size="medium" data-annotation="bubble" data-expandTo="top"></div>').appendTo($('.socialshare'));
loadscript('https://apis.google.com/js/plusone.js', 'google-plusone');
}
})
は(パフォーマンスのために、.socialshare
への参照をキャッシュ)のように、私は本当に、それらを必要とする場合にのみ必要なマークアップを注入します私はscript要素を注入し、私のテンプレートは、ソーシャルボタン(.socialshare
要素)を持つ要素が含まれている場合は、この基本的
function loadscript(url, id) {
var js, fjs = document.getElementsByTagName('script')[0];
if (document.getElementById(id)) { return; }
js = document.createElement('script');
js.id = id;
js.charset = "utf-8";
js.src = url;
fjs.parentNode.insertBefore(js, fjs);
};
のような単純なスクリプトローダ機能n id(他のスクリプトが2回も挿入できないようにするため)
関連する問題
- 1. 手動でのリフェラルへの追従Vs自動追従
- 2. 各ボタンのサウンドを追加する
- 3. UICollectionは手動でセルを追加しますSwift
- 4. Wordpressは手動で.phpファイルを追加します。
- 5. スプリングを手動で追加する
- 6. Alamofireを手動で追加する3
- 7. web.configでReportViewerアセンブリを手動で追加します。
- 8. 手動でedmxファイルのストアドプロシージャを追加
- 9. 手動でパラメータを追加しますか?
- 10. woocommerceで手動で手数料を追加する - add_fee
- 11. MVCミニプロファイラ - 手動で追加するステップ
- 12. 手動でgensimフレーズにコロケーションを追加
- 13. asp.netのjqgridの各行にボタンを追加するには
- 14. LIstViewの各行にボタンを追加する方法は?
- 15. リストの各行にボタンを追加する方法は?
- 16. アクティビティインジケータ私はボタンの活動の指標を追加したボタン
- 17. laravelで手動でデータベーステーブルを追加できますか?
- 18. MySQLテーブルの各行にPHPで削除ボタンを追加する
- 19. C#動的に各オブジェクトプロパティのDataTableに列を追加します。
- 20. Firebaseは手動で追加したオブジェクトに一意のキーを与えることはできますか?
- 21. Django - クラスを追加する手動フォームフィールドレンダリング
- 22. このボタンを追加するカスタムCSSを追加しますか?
- 23. 既存のEclipseボタンに追加の動作を追加しますか?
- 24. 動的にスクロールビューにボタンを追加して追加する
- 25. HP ALMのテストプランなしでテストラボでテストケースを手動で追加
- 26. コレクションにオブジェクトの属性を手動で追加した配列に追加
- 27. プラグインなしで手動でWordpressにAMPページを追加する
- 28. ExtJS 4は動的にボタンを追加します
- 29. Sphinx Searchで手動で行をインデックスに追加するには?
- 30. スクロールビューにボタンを追加することはできますか?
良いソリューション、ありがとうございました。共有してくれてありがとうございます。これは私の例であるimよりも優れているので、これを受け入れてください。 – Johan
Btw、あなたは一般的に使われているライブラリの多くにURLを持っていますか? – Johan