Tombol Like Button yang dirancang oleh beberapa media umum ibarat Google+, Twitter dan Facebook sanggup katakan tombol yang wajib dipasang pada halaman blog, alasannya ialah fungsi dari tombol ini selain untuk menyebarkan juga sangat penting untuk mengetahui seberapa anggun pengunjung untuk menilai kualitas artikel pada suatu halaman, tapi dengan memasang tombol sosial ini sanggup menyebankan proses onload halaman menjadi makin berat, hal ini terjadi alasannya ialah ada beban pemuatan javascript terlebih dahulu dari pihak ketiga ketika pertama kali halaman tersebut melaksanakan proses loading.
Solusi terbaik untuk menangani duduk kasus loading pada pemuatan tombol sosial media sanggup memakai tehnik Asynchronous Javascript Loading, teknik ini bekerja dengan menunda pemuatan javascript sementara hingga halaman yang diakses benar-benar simpulan terbuka sempurna, barulah ketika itu proses pemuatan tombol sosial media ini dijalankan. Untuk ketika ini hanya Google+ saja yang aku ketahui sudah mengaplikasikan pilihan untuk Asynchronous Loading dengan Javascript, sedangkan untuk Twitter dan Facebook tampaknya masih melaksanakan jalan masuk onload pada obyek global yang memberatkan halaman alasannya ialah prosesnya ketika itu juga eksklusif menilik javascript pada widget dan tombol like button.
Cara memasang Asynchronously Javascript Loading:
Silahkan letakan aba-aba dibawah ini diatas tag </body>
<!-- Asynchronous Javascript Loading for Facebook, Twitter, G+ --> <script type='text/javascript'> //<![CDATA[ /* * Async Sharing Buttons (G+, Facebook, Twitter) * http://www.narga.net */ (function(doc, script) { var js, fjs = doc.getElementsByTagName(script)[0], frag = doc.createDocumentFragment(), add = function(url, id) { if (doc.getElementById(id)) { return; } js = doc.createElement(script); js.src = url; id && (js.id = id); frag.appendChild(js); }; // Google+ button add('http://apis.google.com/js/plusone.js'); // Facebook SDK add('http://connect.facebook.net/en_US/all.js#xfbml=1', 'facebook-jssdk'); // Twitter SDK add('http://platform.twitter.com/widgets.js'); fjs.parentNode.insertBefore(frag, fjs); }(document, 'script')); //]]> </script> <!-- End Asynchronously Javascript -->
Selanjutnya kalian sanggup memasang dimana saja tombol Like Button Facebook, Twitter dan Google+ dengan aba-aba dibawah ini (sesuaikan goresan pena warna merah dibawah dengan alamat blog kalian) :
<!-- Google+ --> <div class="g-plusone" data-size="medium" data-count="true" data-href="http://www.zoomtemplate.com"> <!-- Twitter --> <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-url="http://www.zoomtemplate.com">Tweet</a> <!-- Facebook --> <div id="fb-root"></div> <div class="fb-like" data-send="false" data-layout="button_count" data-width="1" data-show-faces="false" data-href="http://www.zoomtemplate.com"></div>
Untuk memasang Tombol Like Facebook, Twitter dan Google+ dalam halaman postingan silahkan gunakan aba-aba dibawah ini:
<!-- Google+ --> <div class='g-plusone' data-count='true' data-size='medium' expr:href='data:post.url'/> <!-- Twitter --> <a class='twitter-share-button' data-count='horizontal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a> <!-- Facebook --> <div id='fb-root'/> <div class='fb-like' data-layout='button_count' data-send='false' data-show-faces='false' data-width='1' expr:data-href='data:post.url'/>
Untuk referensi aktual penggunaan Asynchronous Javascript Loading kalian sanggup melihatnya eksklusif diblog aku ketika ini Blogger Tutorial atau disini Blogger Templates 2013.
Ok, agar sesudah mencoba tutorial ini loading halaman teman semua sanggup jadi makin cepat :) Sumber http://www.o-om.com
EmoticonEmoticon