CARA MEMBUAT SIDEBAR BLOG MELAYANG SAAT DISCROLL KEBAWAH

By snack1

Wednesday, April 19, 2017

Halo sobat blogger, apakabar semua, semoga baik ya? kali ini admin akan share Cara Membuat Sticky Sidebar atau Sidebar Melayang di Blog –  Widget Sticky atau yang lebih dikenal dengan widget melayang pada sidebar blog adalah tampilan widget melayang pada sidebar jika halaman di scroll akan selalu melayang, ini berfungsi untuk mengisi kekosongan saat halaman blog di scroll.

Untuk membuatnya silahkan sobat ikuti langkah langkah berikut ini;

1. Seperti biasa masuk blogger.com dengan akun sobat

2. Setelah masuk dasboard blog lihat menu bilah kiri ,pilih theme > EDIT HTML

3. Setelah template editor terbuka silahkan cari kode </head>  supaya pencarian lebih cepat gunakan CTRL + F Pada keyboard ,lalu pastekan kode dibawah ini tepat diatasnya.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(function () {
var offset = $(".column-right-inner").offset();
var topPadding = 0;
$(window).scroll(function () {
if ($(window).scrollTop() &gt; offset.top) {
$(".column-right-inner").stop().animate({
marginTop: $(window).scrollTop() - offset.top + topPadding
})
} else {
$(".column-right-inner").stop().animate({
marginTop: 0
})
}
})
});
</script>

4. Simpan template.

   Demikian info cara membuat sidebar melayang yang sudah tested pada templat saya , jika sobat ingin utak atik blog sobat silahkan terapkan sesuai penjelsan diatas, selamat mencoba semga bermanfaat 

Keterangan : 

Untuk tulisan yang berwarna merah pada kode script diatas silahka dicocokan dengan id templat sobat,, kalau id saya sesuai denga contoh diatas

Share :

Facebook Twitter Google+