Cara Memasang Sticky Widget Sidebar Melayang Saat Discroll

Posted by Unknown 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

30 komentar:

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

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

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

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

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

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

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

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

    BalasHapus
  9. Komentar ini telah dihapus oleh pengarang.

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

    BalasHapus
  11. keren infonya dan juga bermanfaat sekali

    BalasHapus
  12. kunjungan siang yang menambah wawasan sekali

    BalasHapus
  13. menarik artikelnya dan menmabah wawasan

    BalasHapus
  14. makasih telah berbagi info dan wawasannya makasih

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

    BalasHapus
  16. No live link!!! Dilarang nyepam di sini broo !!!

    BalasHapus
  17. No live link!!! Dilarang nyepam di sini broo !!!

    BalasHapus
  18. No live link!!! Dilarang nyepam di sini broo !!!

    BalasHapus
  19. 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