cara membuat sticky widget pada blog

baca cermati dan pahamilah lalu terapkan semoga bermanfaat
CARA MEMBUAT STICKY WIDGET PADA BLOG




    Kembali lagi di situs blog sarjana beraksi, Oke kali ini admin akan memberikan sedikit  tips atau informasi tentang bagaimana cara  membuat sticky widget pada blog. apa itu sticky ? nahh sticky ini adalah sebuah metode atau sebutan yang banyak di kenal dalam dunia situs khusus nya blog yaitu sticky ini akan membuat widged akan terlihat melayang pada layar monitor di dalam tampilan situs blog.

  Mungkin saja sobat semua bingung tentang bagaimana cara membuat nya. Nahh disini admin akan memberikan cara nya bagaimama , cara nya cukup ,udah sobat tinggal baca dan terapkan, ikuti saja langkah - langkah berikut :

langkah - langkah :

1. sobat login kedalam dashboard blog sobat > lalu pilih tema > dan edit html. bila sudah sobat tinggal copy kode di bawah ini sebelum code </body>


<script type='text/javascript'>
//<![CDATA[
$(function() {
  if ($('#sticky-sidebar').length) { // Ganti "#sticky-sidebar" dengan ID tertentu
    var el = $('#sticky-sidebar');
    var stickyTop = $('#sticky-sidebar').offset().top;
    var stickyHeight = $('#sticky-sidebar').height();
    $(window).scroll(function() {
      var limit = $('#footer-wrapper').offset().top - stickyHeight - 20; // Jarak berhenti di "#footer-wrapper"
      var windowTop = $(window).scrollTop();
      if (stickyTop < windowTop) {
        el.css({
          position: 'fixed',
          top: 20 // Jarak atau margin sticky dari atas
        });
      } else {
        el.css('position', 'static');
      }
      if (limit < windowTop) {
        var diff = limit - windowTop;
        el.css({
          top: diff
        });
      }
    });
  }
});
//]]>
</script>

keterangan : 

* skrip yang berwarna merah " #sticky-sedebar " sobat ganti dengan id widget yang sobat ingin buat sticky

* skrip yang berwarna biru " #footer-wrapper " sobat ganti dengan id dimana sticky itu akan berhenti.

2. Bila sudah silahkan sobat  simpan tamplet dan silahkan sobat lihat hasil nya berhasil atau tidak.

   Oke mungkin cukup sekian dahulu sedikit informasi ataupun tutorial dari admin jika sobat belum paham dan ada yang ingin di tanyakan silahkan sobat tinggalkan komentar nya di situs blog ini
loading...

0 Comments

Silahkan berikan komentar anda tentang artikel dan situs blog ini.
Terima kasih telah berkunjung
EmoticonEmoticon