Cara Memasang Sticky Widget Sidebar Melayang Saat Discroll

Posted by Wahyu basofii on Senin, 23 Desember 2013

Mungkin sobat Blogger sudah sering melihat widget sticky ini atau mungkin ada sobat yang belum tahu tentang widget ini ? jika ada akan coba saya jelaskan sedikit. Seperti apa sih Sticky Widget itu ?

Pengertian simple-nya Sticky Widget itu widget yang menempel. Namun didalam Blogspot Sticky Widget adalah widget pada posisi tertentu yang akan selalu mengikuti tampilan monitor walaupun tampilan halaman terus digulung namun akan berhenti pada posisi awal yang telah ditentukan.(betul gak sih,,, hehehehe)

Bagaimana, sobat tertarik untuk memasang Sticky Widget ini pada Blog sobat? Untuk sobat yang ingin memasangnya, silakan simak langkah-langkah yang akan saya jelaskan .OK, kita mulai.

1. Login blogger >> template >> edit html
copy javascript berikut ini kemudian paste diatas kode </body> pada template sobat

<script type='text/javascript'>
      $(document).ready(function(){
    $("#on-top").sticky({topSpacing:0});
      });
    </script>
<script src='https://googledrive.com/host/0B0Dd8XYrtgdDQS03RzFLSmx6RVE/sticky.js' type='text/javascript'></script>

2. Kemudian simpan template.

Cara menggunakan pada widget

Untuk mengaplikasikanya pada widget yang dipilih untuk di buat sticky hanya tinggal menggunakan id dibawah ini tepat sebelum kode widget

     <div id="on-top"> code widget yang ingin di beri posisi sticky </div>

Jika kurang mengerti akan coba saya jelaskan lagi. disini saya akan membuat widget facebook likebox menjadi sticky

    <div id="on-top"><div class="fb-like-box" data-href="http://www.facebook.com/wahyu.onlyy" data-width="290" data-height="182" data-show-faces="true" data-stream="false" data-show-border="false" data-header="false"></div></div>

Sekian tutorial Cara Membuat Sticky Widget Sidebar di Blogspot, semoga bermanfaat. Jika ada saran dan kritikan atau ada yang kurang dipahami silahkan tinggalkan komentar sobat pada kolom dibawah. Terima Kasih.



Judul : Cara Memasang Sticky Widget Sidebar Melayang Saat Discroll
Label :
URL : http://wahyu-only.blogspot.com/2013/12/cara-memasang-sticky-widget-sidebar.html

35 komentar:

  1. bukmak dulu kang, lagi males otak atik html nih :D

    BalasHapus
  2. Balasan
    1. kan sudah saya jelaskan sob diatas =D

      Hapus
  3. yg nomer 2 nyimpan script nya di edit template kah ?

    BalasHapus
  4. sticky sih udah tapi kenapa backgroudnya tidak sama dengan sidebar yang lain bang kalau udah di scroll

    BalasHapus
  5. makasih gan, kebetulan lagi nyari hehe
    sukses selalu

    BalasHapus
  6. mantap ... tapi kok saya kagak maw yah

    BalasHapus
  7. dicoab utak atik html dengan printah wahyu (y)

    BalasHapus
  8. Demo nya mana neh gan...trims...

    BalasHapus
  9. oh gitu ya cara nya gan,,, nanti saya coba deh,,, terimakasih gan,,sukses selalu..

    BalasHapus
  10. blog yang sangat menarik dan bermanfaat gan,,, thanks ya,,

    BalasHapus
  11. Makasih mas, sudah berhasil dipasang. Ditunggu kunjungan baliknya di http://www.jurutravel.com. Makasih mas

    BalasHapus
  12. MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST MAKASIH ATAS ILMUNYA MAST

    BalasHapus
  13. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  14. wah, keren tips bloggernya gan, salam kenal. :)

    BalasHapus
  15. keren infonya dan juga bermanfaat sekali

    BalasHapus
  16. kunjungan siang yang menambah wawasan sekali

    BalasHapus
  17. menarik artikelnya dan menmabah wawasan

    BalasHapus
  18. makasih telah berbagi info dan wawasannya makasih

    BalasHapus
  19. gagal gan, widgetnya memang jadi tapi bentuknya jadi melebar

    BalasHapus
  20. Terima kasih gan untuk infonya, sangat bermanfaat...

    BalasHapus
  21. trick yang keren nih gan coba pake ah... terkadang sedikit bingung untuk mengisi ruang kosong di sidebar bawah.... dengan ini sepertinya bisa teratasi

    BalasHapus

------------------------------------------------------------------------------------------
Catatan:
• Dilarang menulis link aktif!
• Dilarang ngiklan di kolom komentar!
• Kritik dan Saran sangatlah dibutuhkan, agar blog ini menjadi blog
yang lebih berkualitas.

Thank's
------------------------------------------------------------------------------------------


Flag Counter