Cara Membuat Sticky Widget pada Blogger

    Hey sob? kali ini saya akan membahas atau memberikan sebuah cara bagaimana caranya untuk membuat sticky widget pada blog, mungkin nama sticky widget agak asing terdengar namun saya yakin anda pernah melihat widget yang satu ini, yaitu sebuah widget yang dapat mengikuti arah scroll kita kebawah ataupun keatas. Sticky widget juga dapat sebagai penghias dari sebuah blog karena dengan fungsi sticky ini blog anda bisa lebih terlihat canggih. 

Sticky widget juga biasa dilihat sebagai widget yang dapat melayang mengikuti halaman saat di gulirkan kebawah dan keatas hingga posisi semula. Untuk menambahkan fungsi sticky pada blog sebenarnya cukup mudah, anda bisa mengukti cara berikut ini. Oke langsung saja ke cara pemasangan fungsi sticky pada blog.


Cara Mudah Menambah Fitur Sticky Widget

1. Masuk pada blog anda.

2. Lalu klik "Template" dan pilih "Edit HTML".

3. Jika sudah, anda bisa copy script di bawah ini dan pastekan tepat sebelum "</body>".

<script type='text/javascript'>
//<![CDATA[
// Sticky Widget
function makemeSticky(e){function t(){var e=s.getBoundingClientRect();e.top<0?(n.className=a+" makesticking",n.style.width=i+"px"):n.className=a}var n=document.getElementById(e),s=document.createElement("div");n.parentNode.insertBefore(s,n);var i=n.offsetWidth,a=n.className+" makesticky";window.addEventListener("scroll",t,!1)}makemeSticky("HTML2");
//]]>
</script>

#NB : HTML2 adalah ID widget yang ingin di tambahkan fitur sticky. Anda bisa ganti sesuai dengan widget mana yang anda ingin tambahkan fitur sticky. Jika anda bingung anda bisa kunjungi ini : Cara Mengetahui ID Widget

4. Selanjutnya salin kembali script di bawah ini dan pastekan tepat sebelum "]]></b:skin>" atau "</style>".

.makesticking{background:none!important;position:fixed!important;top:25px;z-index:99;-webkit-transform:translateZ(0);}
#HTML2 .widget-content {padding:0;margin:auto;}

5. Terakhir Simpan Template anda, dan lihat hasilnya.

Oke mungkin itu saja yang bisa kita berikan mengenai artikel "Cara Membuat Sticky Widget pada Blogger" ini, semoga dengan apa yang sudah kita berikan ini dapat bermanfaat bagi Kalian. Jika ada Kesalahan atau ada Pertanyaan serta Tambahan bisa isi pada kolom komentar. Terimakasih.

Post a Comment