Cara Membuat Sticky Widget di Sidebar Blogger

Cara Membuat Sticky Widget di Sidebar Blogger | Assalamualaikum wr.wb. Tahukah kalian apa yang dimaksud dengan Sticky Widget itu? Sticky  yang berarti Lengket dalam kamus bahasa inggris, Widget tentunya kalian sudah tahu dengan ini bagi kalian seorang blogger.

Jadi Sticky Widget ini yaitu berfungsi untuk membuat sebuah widget tertentu menjadi sticky atau melayang dan berjalan mengikuti kursor yang ketika halaman situs digulir ke atas atau kebawah. Dan Penerapan sticky Widget ini biasanya diterapkan pada widget yang dianggap penting,  misalnya pada widget recent post (list artikel terbaru), widget like fb, subscribe channel youtube, atau widget lainnya.

Untuk itu Tutorialankha kali ini akan berbagi bagaimana Cara Membuat Sticky Widget di Sidebar Blog. Yuk langsung saja ikuti tutorial berikut ini, silahkan diperaktekan semoga lancar diterapkan di blog kalian.

Cara Membuat Sticky Widget di Sidebar Blog

1. Masuk ke akun Blogger kalian.

2. Pada panel/dashbor navigasi, silahkan pilih Tema kemudian klik Edit HTML.

3. Silahkan tambahkan kode dibawah ini sebelum/diatas kode </body>.

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<script type='text/javascript'>
//<![CDATA[
// Sticky widget
$(function(){if($("#HTML1").length){var o=$("#HTML1"),t=$("#HTML1").offset().top,i=$("#HTML1").height();$(window).scroll(function(){var s=$("#comments").offset().top-i-20,f=$(window).scrollTop();if(f>t?o.css({position:"fixed",top:15}):o.css("position","static"),f>s){var n=s-f;o.css({top:n})}})}});
//]]>
</script>
</b:if>

Keterangan

- Silahkan kalian ganti "HTML1" dengan ID widget yang ingin dijadikan sticky.

- Kode berwarna merah berfungsi untuk menghilangkan efek sticky pada halaman mobile.

- Angka "15" merupakan jarak widget.


Untuk menemukan ID widget, silahkan buka Tata Letak kemudian klik widget yang ingin kalian akan dijadikan sticky. pada alamat widget terdapat ID widget.

4. Silahkan tambahkan kode CSS dibawah ini sebelum atau diatas kode  </b:skin>

#HTML1{width:100%;max-width:300px}

5. Selanjutnya ganti HTML1 dengan ID widget yanga tadi kalian terapkan sebelumnya
6. simpan dan lihat hasinya.

Demikanlah tutorial singkat mengenai Cara Membuat Sticky Widget di Sidebar Blogger ini semoga bermanfaat dan sukses serta menambah wawasan kalian dalam dunia blogger ini. Wassalam..

Sertifikatkan kemampuan Komputer dan Bahasa Inggris anda
Sertifikat Komputer dan TOEFL tanpa ikut kursus, Ikuti Paket Ujian Saja
Klik Disini