Cara Menciptakan Widget Melayang Di Blogspot

Cara Membuat Widget Melayang di Blogspot - Widget Melayang atau dikenal dengan Sticky Widget ialah tampilan dari komponen sebuah template blog yang terletak disebelah kanan atau kiri (sidebar) dan sanggup melayang apabila halaman blog ditarik (scroll) kebawah.

Hal ini dipakai untuk mengisi kekosongan halaman dan dimanfaatkan untuk menarik pengunjung blog. Biasanya banyak para pemilik blog yang mengisi sticky widget dengan recent post, popular post, tombol media sosial, iklan blog dan masih banyak yang lain.

Sticky Widget tolong-menolong sanggup kalian lihat menyerupai yang ada pada blog milik saya ini. Disitu saya tampilkan sebuah widget yang sanggup melayang yang berisi wacana artikel-artikel yang gres di publish.

Cara Memasang Widget Melayang di Blogspot

Langkah awal jikalau kalian ingin memasang sticky widget atau widget melayang diblog adalah:

Buka akun blogger kemudian pribadi menuju ke Edit HTML yang ada pada dashboard (Tema > Edit HTML).

Tambahkan arahan javascript dibawah ini sebelum arahan "</body>".

<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=$("#footer").offset().top-i-20,f=$(window).scrollTop();if(f>t?o.css({position:"fixed",top:25}):o.css("position","static"),f>s){var n=s-f;o.css({top:n})}})}});
//]]>
</script>

Fungsi dari javascript diatas ialah untuk memproses widget supaya sanggup melayang diblog. Pada arahan diatas terdapat arahan #HTML1 yang menunjukan bahwa widget dengan ID tersebut nantinya akan melayang.

Kemudian tambahkan arahan CSS dibawah ini sebelum arahan "</style> atau ]]></b:skin>"

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

Kode CSS ini dipakai untuk mengatur ukuaran kebar dan menandai widget yang akan dijadikan sticky atau sanggup melayang.

Demikian cara menciptakan widget melayang di blogspot. Apabila dalam klarifikasi di atas masih ada yang kurang dipahami sanggup pribadi ditanyakan melalui komentar dibawah.

Sebenarnya banyak cara yang sanggup kita lakukan untuk menciptakan sticky widget menyerupai yang saya jelaskan diatas. Namun berdasarkan saya cara di atas merupakan cara yang paling mudah.

Sumber:
https://mamankdzgn.blogspot.com//search?q=cara.membuat.sticky.widget.di.sidebar.blog
https://mamankdzgn.blogspot.com//search?q=cara.membuat.sticky.widget.di.sidebar.blog