Membuat Tombol Back to the top (kembali ke atas)

Membuat tombol Back to the top (kembali ke atas) pada blog adalah salah satu cara untuk mempermudah pengunjung blog yang sedang membaca artikel blog kita untuk melakukan shortcut kembali ke posisi atas halaman blog, setelah melakukan scroll
halaman blog hingga ke bawah. Karena adakalanya halaman blog kita pada suatu posting tertentu memang sangat panjang artikelnya. Memperpendek halaman blog adalah solusi paling tepat untuk mengurangi resiko pengunjung jenuh karena halaman blog kita terlalu panjang, yaitu dengan cara menampilkan postingan di homepage seringkas mungkin, mungkin dengan mengatur jumlah posting yang kita tampilkan di homepage cukup 2 posting atau 3 posting saja, begitupun tentu saja harus kita penggal dengan fasilitas read more.

Hal ini tentu saja berbeda dengan cara memperpendek halaman blog pada halaman posting artikel, kita bisa memakai trik memperpendek kotak komentar kita dengan mengunakan scroll, untuk trik ini silahkan baca di sini .Namun jika memang artikel kita sangat panjang ya apa boleh buat, kita masih bisa meringankan beban jari-jari pengunjung kita untuk tidak terlalu capek scroll mouse jika ingin kembali ke halaman atas untuk mengakses menu lainnya(ingat, pengunjung adalah raja..hehehe), cukup dengan 1 klik saja, yaitu dengan menggunakan fasilitas tombol back to the top. Dengan menggunakan tombol back to the top (kembali ke atas) ini memungkinkan pembaca lebih mudah kembali ke atas halaman. Tombol Icon tersebut selalu terletak pada tempat atau posisi yang tetap walaupun adanya scrolling page.

Oke sobat blogger langsung saja ambil beberapa code di bawah ini dan segera pasang fasilitas tombol back to the top di blog anda karena ini meprupakan salah satu widget blog keren jika sudah terpasang di blog anda...oh ya beberapa contoh di bawah ini aku dapat dari tetangga sebelah, sayang aku dah lupa alamatnya. Jadi mohon maaf tidak bisa saya share link nya.

Cara menaruhnya, silahkan anda login ke akun blogger anda, kemudian masuk ke dashboard, klik Design, lanjutkan ke Edit HTML, cari kode </body> kemudian letakkan salah satu kode di bawah ini di atas kode </body>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotopbiru.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotophitam.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotophijau.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotopkuning.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotopmerah.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotoporange.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotoppink.png'/></a>


<!-- Bact to top designed by syilpid - www.tips-fb.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://i15.photobucket.com/albums/a398/syilpid/Backtotopungu.png'/></a>

Link photobucket berwarna merah  adalah link icon gambar tersebut, anda bisa menggantinya dengan link icon buatan anda sendiri.
Share :
PreviousPost
NextPost

Author:

3 komentar:

  1. Sip bisa dicoba. Bagus nih tutorialnya..

    BalasHapus
  2. sipp info yg bagus untuk kita2 yg msh newbie gan ...... thanks
    http://rentalmobilmakassar.blogspot.com/

    BalasHapus

Rekomendasi