Sticky Widget Sosial Keren di Blog

February 03, 2016
Membuat Widget Share Sosial di Blog memang sangat keren, tampilan blog anda akan terlihat keren, elegan dan professional. Tetapi sebelum saya melanjutkan kalimat demi untaian kalimat, terlebih dahulu saya ingin menyapa kabar anda semua, semoga kita semua selalu berada dalam lindungan-Nya.
Sticky Widget Sosial Keren di Blog

Pada kesempatan malam hari yang berbahagia ini, marilah kita sama-sama mengucap puja dan puji kepada Tuhan yang maha esa semoga kita menjadi manusia yang bermanfaat bagi sesama. Pidato ni yeeee......

Oke guys, kita langsung saja pada pokok persoalan yang akan saya sampaikan dengan kategori Tutorial. Dalam kesempatan yang berbahagia ini, saya akan mencoba share Cara Membuat Sticky Widget Sosial yang keren di blog, mengenai tampilannya bisa anda lihat di sebelah kanan blog ini.

Baca : Cara Menampilkan Postingan Blog di Facebook

Bagaimana cara membuat widget sosial share seperti dalam blog ini, berikut langkah demi langkah agar terpasang rapi di blog anda. Cara pertama login dulu ke akun blogger anda, lalu pilih blog yang akan dipasang widget sosial share. Langkah selanjutnya pilih Template dan masuk ke menu Edit HTML. Jika anda sudah berada di menu Edit HTML sekarang gunakan perintah cepat di Keyboard Anda dengan menekan CTRL+F dan cari kode berikut :

</body>

Setelah anda menemukan kode tersebut, selanjutnya lekatkan kode di bawah ini tepat diatas kode tadi !

<script type='text/javascript'>
//<![CDATA[
(function(){var fb1=document.createElement('script');fb1.type='text/javascript';fb1.async=true;fb1.src='http://connect.facebook.net/id_ID/all.js#xfbml=1','facebook-jssdk';var fb2=document.getElementsByTagName('script')[0];fb2.parentNode.insertBefore(fb1,fb2)})();(function(){var tw1=document.createElement('script');tw1.type='text/javascript';tw1.async=true;tw1.src='http://platform.twitter.com/widgets.js';var tw2=document.getElementsByTagName('script')[0];tw2.parentNode.insertBefore(tw1,tw2)})();(function(){var gp1=document.createElement('script');gp1.type='text/javascript';gp1.async=true;gp1.src='https://apis.google.com/js/plusone.js';var gp2=document.getElementsByTagName('script')[0];gp2.parentNode.insertBefore(gp1,gp2)})();
$(document).ready(function(){
$("#on-top").sticky({topSpacing:0});
});
</script>
<script src='https://googledrive.com/host/0B0Dd8XYrtgdDQS03RzFLSmx6RVE/sticky.js' type='text/javascript'>
//]]>
</script>


Setelah anda melekatkan kode diatas ke dalam struktur HTML, sekarang Simpan Template anda. Setelah tersimpan, selanjutnya menuju menu Tata Letak/Lay Out dan pilih Add Wi/Gadget. Seterusnya pilih Add HTML/JavaScript dan Paste kode dibawah ini kedalamnya.

<div id="on-top"><div style="background:#3498db;font-weight:bold;font-size:150%;text-align:center;padding:10px 0;"><a href="http://www.blogger.com/follow-blog.g?blogID=480124002062836339" target="_blank" title="Follow this blog"><span style="color:#fff">Join</span> <span style="color:#000">Now</span></a></div><div style='background:#fff;margin:0;border:1px solid #ccc;border-bottom:none;border-top:none'><div style='background:#fff;margin:0;'><div class="fb-like-box" data-href="https://www.facebook.com/Heddysblog" data-colorscheme="light" data-show-faces="false" data-header="true" data-stream="false" data-show-border="false"></div></div><div style="background:#fff; border-top:1px solid #ccc;margin:0; padding:5px 0 5px 40px"><a href="https://twitter.com/hedd10" class="twitter-follow-button" data-show-count="true" data-show-screen-name='false' data-lang="id">Ikuti @hedd10</a><div class="g-plusone" data-size="medium" data-count="true" data-width="100" data-href="http://heddysblogger.blogspot.com/"></div></div></div><div class="g-person" data-href="//plus.google.com/+HediSatya" data-layout="landscape" data-rel="author"></div></div>


Sebelum anda menyimpan widget tersebut, lakukan pengeditan terlebih dahulu. Anda perlu mengedit beberapa link sosial media anda

Facebook, Google Plus, Twitter

Ganti semuanya dengan url sosial media anda dan Simpan untuk menyelesaikan pemasangan Widget sosial share di blog anda. Dalam memasang widget ini, tentunya ada sisi kurang dan lebihnya. Sisi lebih dari pemasangan widget ini adalah memudahkan orang lain untuk Like, Share, Follow Be A Friend akun sosial media anda dan sisi kurangnya adalah Loading Blog menjadi lebih berat (Baca : Cara Meringankan Loading Blog) Demikian tutorial tentang Cara membuat Sticky Widget Sosial Keren di Blog semoga bermanfaat.

Artikel Terkait

Previous
Next Post »

1 comments:

Write comments

Ajukan Pertanyaan Anda Disini? EmoticonEmoticon