Cara Membuat Sticky Widget di Sidebar Blog

Cara Membuat Sticky Widget di Sidebar Blog

Cara Membuat Sticky Widget di Sidebar Blog - Sticky Berasal dari Bahasa Inggris Yang Artinya Menempel. Sticky Widget Adalah Kata Yang Sering Terdengar Dalam Istilah Blogger, Namun Masih Banyak Yang Belum Memahami Apa itu Sticky Widget. Sticky Widget adalah Widget Yang di Pasang Di Blog Namun Jika Blog Di Scroll Kebawah maka Widget itu Akan Ikut Kebawah Mengikuti Gerak Scroll. Nah, Pada Kesempatan Kali ini J4rviz Blog Akan Membagikan Tutorial Memasang Sticky Widget di Blog Sobat. Oke Simak dengan Seksama ya....

Cara Pemasangan

Untuk Pemasangan Sticky Widget, Caranya Sangat Mudah yaitu Dengan
1. Pemasangan CSS
2. Pemasangan JavaScript

Pemasangan CSS

1. Login Ke Blogger
2. Masuk Ke Template > Edit HTML
3. Masukan CSS Berikut di atas ]]></b:skin>

.sticky {
position:fixed;
top:10px;/* jarak dari atas*/
z-index: 100;
}

Pemasangan JavaScript

1. Login Ke Blogger
2. Masuk Ke Template > Edit HTML
3. Masukan JavaScript Berikut di atas </body>
<script type='text/javascript'>
$(document).ready(function() {
var stickyWidgetTop = $('#HTML7').offset().top; 
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();     
if (scrollTop > stickyWidgetTop) { 
    $('#HTML7').addClass('sticky');
} else {
    $('#HTML7').removeClass('sticky'); 
}
};
stickyWidget();
$(window).scroll(function() {
    stickyWidget();
});
});
</script>
Ganti Tulisan HTML7 Dengan ID Widget Sobat yang akan di Buat Sticky Widget.

Cara Mencari ID Widget

1. Login Ke Blogger
2. Masuk Ke Tata Letak
3. Pilih Widget Yang akan Di buat Sticky Widget dan Klik Edit
4. Lalu Lihat Gambar Berikut Untuk Mencari ID Widget
Mencari ID Widget Sebuah Widget




oke... itulah sedikit Tutorial dari J4rviz Blog...
Semoga Tutorial ini Bermanfaat..
terima kasih sudah berkunjung dan jangan lupa Komen + Follow Blog ini untuk Mengikuti Update terbaru J4rviz Blog

Comments

  1. keren gan agar blog jadi unik
    visit back

    ReplyDelete
  2. Wah keren gan izin coba ya gan

    ReplyDelete
  3. gan klo pngen masang nav bar sperti di blog ini yg ada notifikasinya gmn??
    boleh minta tutornya ga? mksh

    ReplyDelete
  4. wahaha akhirnya ketemu juga tutor nya ,
    kesusahan nih buat sticky widgetnya , moga2 masih bisa gan tutornya .

    ReplyDelete
  5. Kalau untuk 2 widget atau lebih gimana ? Bisa atau enggak ?

    ReplyDelete
    Replies
    1. Tentu Bisa... Namun Kedua / Lebih Widget Tersebut harus Dikelompokkan menjadi Satu Widget/Script .. Anda Bisa Melihat Tutorialnya disini Cara Membuat 2 Widget atau Lebih dalam satu Script Lalu Anda Baru Bisa Memakai Cara ini

      Delete
    2. Disini Gan.. http://j4rviz.blogspot.com/2014/01/cara-membuat-2-widget-dalam-1-script-di.html

      Delete

Post a Comment

- Tidak Boleh Komentar Dengan Kata - Kata Kotor
- Tidak Boleh Komentar Menyertakan Link Aktif ataupun Mati
- Berkomentarlah sesuai dengan topik
- Kalau mau mendapatkan backlink, silahkan comment Dengan openID atau url
- komentar yg melanggar akan langsung dihapus

Terima Kasih,
J4rviz Blog