Cara Membuat Sticky Widget di Sidebar Blog

8:06 pm
Cara Buat Sticky Widget Blog

Kampoeng iLmu2 - Cara Membuat Sticky Widget di Sidebar Blog , Sticky Dalam Bahasa Inggris Artinya Menempel / Tempel. Berarti Mengartikan Widget Sticky Adalah Widget Yang Menempel Mengikuti Gerak Scroll Naik Turun Blog ,banyak Blogger Yang Memanfaatkan ini Untuk Iklan Agar Selalu Mengikuti Mouse Visitor Dengan Naik Turun-Nya Iklan Dengan Menggunakan Widget Sticky, Atau Hal - Hal Yang Ingin Pemilik Blog Widget Mengikuti Naik Turun Scroll agar mendapat keUntungan. Nah Pada kesempatan Saya Karena Sedang Tidak Sibuk ,Kampoeng iLmu2 Berbagi Ilmu.

Cara Pemasangan Sticky :

Langkah Pertama Masuk Kedasbor Blog !
Kedua Klik TEMPLATE >> EDIT HTML.

Sticky CSS :


Setelah Itu Cari Kode ]]></b:skin> Gunakan (CTRL+F) Biar pencarian kode lebih cepat ,lalu copy CSS dibawah ini dan pastekan tepat diatas kode tadi :
.sticky {
position:fixed;
top:10px;/* jarak dari atas*/
z-index: 100;
}

Sticky Javascript :


Setelah Selesai Mengurusi CSS Kita lanjut ke langkah selanjutnya, cari kode </body> sLalu Copy Javascript dibawah dan pastekan tepat di atas kode tadi :
<script type='text/javascript'>
$(document).ready(function() {
var stickyWidgetTop = $('#HTML1').offset().top; 
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();     
if (scrollTop > stickyWidgetTop) { 
    $('#HTML1').addClass('sticky');
} else {
    $('#HTML1').removeClass('sticky'); 
}
};
stickyWidget();
$(window).scroll(function() {
    stickyWidget();
});
});
</script>

Silahkan Ganti HTML1  Dengan ID Widget Blog Yang Akan Kamu Pakaikan Sticky . Selesai.

Semoga bermanfaat ,Jika Ada Yang Masih Bingung Atau Salah Bisa Tanyakan dikotak komentar di bawah . LIKE !

Share this :

Aditya Iqbal Adalah Blogger Asal Indonesia Yang Bekerja Di Bidang IT dan Design.

0 Komentar

+ PERATURAN +

♣ Berkomentar Relavan
♣ Berkomentar Sopan
♣ Tidak Boleh Berkomentar Kotor
♣ Saling Menghargai Sesama Komentator

- CEO

Penulisan markup di komentar
  • Silakan tinggalkan komentar sesuai topik. Komentar yang menyertakan link aktif, iklan, atau sejenisnya akan dihapus.
  • Untuk menyisipkan kode gunakan <i rel="code"> kode yang akan disisipkan </i>
  • Untuk menyisipkan kode panjang gunakan <i rel="pre"> kode yang akan disisipkan </i>
  • Untuk menyisipkan quote gunakan <i rel="quote"> catatan anda </i>
  • Untuk menyisipkan gambar gunakan <i rel="image"> URL gambar </i>
  • Untuk menyisipkan video gunakan [iframe] URL embed video [/iframe]
  • Kemudian parse kode tersebut pada kotak di bawah ini
  • © 2015 Simple SEO ✔