Cara Membuat Widget Sidebar Berhenti Saat Di Scroll Ke Bawah

Publish Date : 15-10-2016 , dibaca 7920 kali, Hari ini dibaca : 1 kali ,0 comments

Tutorial kali ini admin akan menjelaskan Tutorial Cara Membuat Widget Sidebar Website / BLog Berhenti saat di Scroll Ke bawah , Widget merupakan elemen yang sangat penting dalam suatu blog. Fungsi widget sangat banyak sekali dan bermacam-macam bentuknya. Widget biasanya terletak disamping postingan biasa disebut dengan sidebar dan terletak dibawah postingan biasa disebut dengan footer widget. Widget merupakan elemen yang banyak fungsinya, salah satunya sebagai tempat informasi pemilik, tombol berbagi, dan tempat menampilkan iklan. Sebagian bloger sering memanfaatkan widget di samping postingan sebagai ajang iklan pada blog mereka.

Widget dengan informasi khusus pastinya harus kita letakkan pada tempat yang kebanyakan orang pasti melihatnya, cara ini disesuaikan agar informasi yang terdapat pada widget mendapat perhatian khusus bagi pembaca blog kita. Agar widget bisa bekerja maksimal pastinya harus ada yang kita lakukan dengan widget tersebut supaya memberikan dampak positif terhadap informasi yang kita berikan.

widget sidebar statis tetap

Membuat Widget Sidebar Website / BLog Berhenti / Statis Saat scroll ke Bawah

Step 1. Login ke blog sobat

Step 2. Masuk ke menu Tamplate dan cari kode </ body>

Step 3. Copy dan Pastekan code script ini di atas code </ body>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<SCRIPT>
$(document).ready(function() {
var div = $('#YOUR_WIDGET_ID');
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>

Step 4. Ubahlah Your_widget_id , dengan id widget anda , misalnya : <div id='widget1'>

Step 5. Save Tamplate dan Lihat hasilnya

Sekedar saran agar sebaiknya widget yang akan dipasang merupakan widget yang terakhir pada settingan sidebar pada Tata Letak agar informasi widget yang selanjutnya bisa terlihat saat discroll.

Produk Rekomendasi

Artikel Terkait

Diskusi



wa