Jumat, 16 Mei 2014

Membuat Widget Melayang di Blog

Ada banyak trik dalam membangun sebuah situs atau blog supaya kelihatan lebih rapi, enak dipandang, profesional dan orang mau kembali lagi untuk membaca dan melihatnya. Berikut ini adalah salah satu trik yang bisa Anda gunakan untuk blog yang Anda miliki yaitu dengan membuat widget melayang dan tetap terlihat ketika mouse di scroll ke sampai bawah. Widget ini bisa juga disebut dengan widget sticky. Jika Anda tertarik untuk menggunakannya berikut adalah cara pembuatannya:


Membuat Widget Melayang di Blog

1. Masuk ke dasbor Blogger

2. Pilih Template > Edit HTML

3. Cari kode </body> (gunakan Ctrl+F untuk memudahkan)
<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>
4. Simpan template

Langkah berikutnya adalah menambahkan kode pada widget yang akan dibuat melayang.

5. Dari dasbor Blogger pilih Tata Letak > Tambahkan Gadget > Cari HTML/Javascript

6. Pada kolom konten tambahkan kode berikut:
<div id="on-top"> Kode widget paste disini  </div>
7. Simpan widget dan lihat hasilnya

Demikian tutorial tentang cara membuat widget melayang pada blog.  Jika ada pertanyaan seputar topik di atas silahkan tinggalkan komentar. Jangan lupa bantu bagikan melalui sosial media karena siapa tahu ada teman Anda yang membutuhkan tutorial di atas.

Tidak ada komentar:

Posting Komentar