Cara Mudah Membuat Widget Mengikuti Scroll Dengan Sticky Widget Di Blogger

Sampul Ilmu~ Pada Saat membuat sebuah blog pernahkah anda mengiginkan salah satu widget diblog anda mengikuti scroll pada saat discroll kebawah.  Pemasangan Sticky Widget pada blogger tentunya sangat berpengaruh karena penempatan sticky widget adalah untuk menutupi ruangan yang kosong pada blogger disaat scrollbar mengarah kebawah

Pada postingan kali ini Sampul Ilmu menjelasakan tentang Cara Mudah Membuat Widget Mengikuti Scroll Dengan Sticky Widget Di Blogger. istilah sticky Dalam bahasa indonesia adalah menempel / Melekat Maksudnya Adalah widget pada blogger akan selalu mengikuti mouse apabila ini biasanya digunakan untuk menutupi daerah yang kosong pada saat scroll diarahkan kebawah. widget dengan posisi sticky ini digunakan oleh bloger sebagai widget untuk menarik perhatian. 

Untuk cara pembuatannya ikuti langkah-langkah dibawah ini

Login Kehalaman Dashboard Blogger Anda.

Tentukan Widget/Gadget apa yang anda ingin pasangkan sticky widget Dengan Cara.

Clik Layout Pada Dashboard Blogger Anda Kemudian Pilih Widget/Gadge anda dengan cara Clik Edit kemudian Copy Nama Gadget (Nama Gadget Terletak pada Akhir) Seperti Pada Gambar Dibawah ini:

Gambar Halaman Gadget Di Blogger

Catatan :
Penempatan Widget/Gadget Yang akan dipasangkan Sticky Usahakan Berada Di Bawah agar pada saat scroll diarahkan kebawah tidak akan menimpa widget yang lain.

Langkah Berikutnya Clik Template.

Kemudian Clik Edit HTML.  

Cari Kata </b:skin>. 

Copy Kode Dibawah ini Kemudian Paste Tepat Diatas Kode </b:skin>.

.sticky {
  position:fixed;
  top:20px;
  z-index: 100;
  width:300px;
}

Keterangan :
Top: 20px Adalah Jarak Widget dari Atas ( Ubah Ukuran Tersebut Sesuai dengan Template Blogger Anda)
Width:300px Adalah Ukuran Lebar Widget (Ubah Ukuran Tersebut Sesuai Dengan Lebar Widget Pada Blogger Anda)

Setelah Langkah Diatas Telah Selesai dilakukan Langkah Selanjutnya Adalah:
Cari Kode </body> (Kode Tersebut Terletak Paling Bawah)
Copy Code Dibawah ini Kemudian Paste Tepat Diatas Kode </body>

<script type='text/javascript'>
$(document).ready(function() {
var stickyWidgetTop = $(&#39;#PopularPosts2&#39;).offset().top;
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();    
if (scrollTop &gt; stickyWidgetTop) {
    $(&#39;#PopularPosts2&#39;).addClass(&#39;sticky&#39;);
} else {
    $(&#39;#PopularPosts2&#39;).removeClass(&#39;sticky&#39;);
}
};
stickyWidget();
$(window).scroll(function() {
    stickyWidget();
});
});
</script>

Keterangan :
Ubah Kata PopularPosts2 Dengan Nama Widget/Gadget Anda 
Clik Save Template Kemudian Privew Blog Anda Dan Lihat Hasilnya.

Untuk DEMOnya Anda Dapat Melihat Pada ARTIKEL POPULER Yang Berada Disebelah Kanan

Semoga Cara Mudah Membuat Widget Mengikuti Scroll Dengan Sticky Widget Di Blogger Dapat Bermanfaat.