Cara Membuat Widget Sticky di Sidebar

Widget sticky adalah widget yang tetap akan muncul meskipun laman blog di scroll ke bagian bawah oleh pengunjung. Widget sticky biasanya digunakan blogger untuk menonjolkan konten atau informasi tertentu, seperti widget langganan artikel, widget artikel populer, hingga iklan.

Widget sticky sebenarnya cukup berguna untuk memastikan pengunjung tidak melewatkan konten penting yang Anda pasang di sidebar. Karena yang dibutuhkan pengunjung adalah informasi, maka fokus mereka tentu saja pada area laman artikel, dan semakin panjang artikel yang mereka baca, maka semakin kecil pula potensi konten penting di sidebar terbaca oleh mereka.

widget sticky
Contoh widget sticky di sidebar

Solusinya adalah dengan memasang widget sticky. Untuk membuat widget sticky di sidebar cukup dengan menambahkan kode Javascript diatas tag </body> pada template blog. Dan bagi pengguna WordPress self-hosting bisa juga dengan menggunakan plugin. Cukup banyak plugin widget sticky yang bisa Anda gunakan secara gratis, berikut ini beberapa diantaranya:

  • WP Stick It WordPress Plugin
  • Q2W3 Fixed Widget WordPress Plugin
  • Advanced Floating Content Plugin
  • Floatton WordPress Floating Action Button
  • Theia Sticky Sidebar For WordPress

Cara Memasang Widget Sticky Tanpa Plugin

Copy kode dibawah ini

<script type=”text/javascript” src=”http://code.jquery.com/jquery-latest.js”></script>
<SCRIPT>
$(document).ready(function() {
var div = $(‘#WIDGET_ID_NAME‘);
var start = $(div).offset().top;
$.event.add(window, “scroll”, function() {
var p = $(window).scrollTop();
$(div).css(‘position’,((p)>start) ? ‘fixed’ : ‘static’);
$(div).css(‘top’,((p)>start) ? ‘0px’ : ”);
});
});
</SCRIPT>

Silakan masuk ke laman editor template, dan paste kode tersebut tepat diatas kode </body>

Simpan perubahan – Selesai

Silakan cek hasilnya.

Note: Ganti kode berwarna merah dengan ID widget yang ingin Anda buat menjadi sticky (floating).

Hosting Terbaik Indonesia

Leave a Reply

Your email address will not be published. Required fields are marked *

*Hanya komentar relevan yg akan di publish; Gunakan nama Anda (no keywords), No spam!