Skip to main content
KOMPI AJAIB

follow us

Membuat Back To Top Button

Membuat Back To Top Button kita tidak perlu mengobok-obok HTML template blog, hanya menambahkan kode scriptnya pada gadget HTML sidebar blog.

Baca juga:


Pada waktu yang lalu saya sudah memposting cara membuat scroll to top button dengan efek scroll atau menggulung halaman ke atas. Nah sekarang saya mencoba untuk share cara Membuat Back To Top Button.

Berbeda dengan scroll to top yang mempunyai efek menggulung halaman, Back To Top Button membawa pengguna langsung menuju ke atas halaman ketika di klik. Cara Membuat Back To Top Button juga berbeda dengan scroll to top yaitu pada scroll to top kita harus memasukan kode scriptnya pada template dengan mengedit kode HTML template blog. Sedangkan pada cara Membuat Back To Top Button kita tidak perlu mengobok-obok HTML template blog, hanya menambahkan kode scriptnya pada gadget HTML sidebar blog.

Cara Membuat Back To Top Button seperti di bawah ini:
1. Kita login ke dashboard >> Layout/Tata Letak >> Add a gadget >> Pilih HTML/JavaScript >> kemudian copas kode di bawah ini:


<div style="display:scroll;position:fixed;bottom:5px;right:5px; moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter:
progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;"><a href="#" title="Back to Top"> Back To Top </a></div>

right menunjukan button berada di sebelah kanan, ganti dengan left apabila Anda menginginkan button berada di sebelah kiri.

2. Simpan widget Anda dan lihat penampakannya di halaman blog Anda.

Demikian sharing Membuat Back To Top Button kali ini mudah-mudahan bermanfaat.

You Might Also Like:


Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar