Cara Memasang Tombol Back To Top Di Blog

Tips Blogger. Cara Memasang Tombol Back To Top. Kali ini saya akan menjelaskan tentang Cara Memasang Tombol Back To Top Di Blog, atau memasang Tombol Kembali ke Atas dan Kembali Turun ke Bawah. serta lengkap dengan tombol kembali ke Branda / home dan mual ulang /reload di blog anda.

Sebelum menjelaskan tentang cara memasangnya, pastinya anda pun sudah tau dan sudah pernah mengunjungi suatu blog milik seseorang di internet, dan anda pun pastinya pernah melihat tombol Back To Top di blog mereka. dan Di artikel yang saya tulis ini, akan menjelaskan cara pembuatannya.

Dengan memasang tombol Back To Top ini sanagtlah perlu, karena untuk menyikapi blog yang terlalu memanjang kebawah sehingga dengan adanya tombol Back To Top ini bisa membuat para pengunjung blog bisa dengan mudah mengaksesnya.

Unjtuk cara pemasangan Tombol Back To Top ini ada Dua Cara yang akan saya jelaskan di artikel ini, Langsung saja bagi anda yang ingin mencobanya bisa ikuti salah satu cara yang sudah saya sediakan dibawah.

Cara Memasang Tombol Back To Top

Cara Pertama
=> Masuk ke dasbor Blog anda
=> Pilih Template -> Edit HTML
=> Carilah kode </body> (gunakan Ctrl+F agar lebih mudah)
=> Masukkan kode dibawah ini Sebelum kode </body>

<!-- Bact to top By 4rie-ngr.blogspot.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1YWd6m4UGhSbf2l75BYyfPcNoQQU3UNHLlhyXnuEdTEdlWBbeFnLYJJB4zcc1IPG4N5A2MV3c8wQ74X7JERNHLMvJTXltrokHcvN9SUaGpDjrjN1MezurlYOBs_gbTbMD7WouNRiPD2OU/s1600/Untitled-2.png'/></a>

Ket!!
Kode warna Merah adalah posisi tombol berada
Kode warna Biru adalah URL gambar tombol (Ganti dengan URL gambar yang anda inginkan)

=> Simpan Template
=> Selesai. dan lihat hasilnya dari Cara Pertama ini.

Cara Kedua
Cara yang sudah saya jelaskan di cara yang pertama, hanya memasang tombol Back To Top biasa, Jika anda ingin memasang yang lebih komplit atau lengkap, ada di cara kedua ini.

=> Masuk ke Dasbor Blog anda
=> Pilih Template-> Edit HTML
=> Cari kode ]]></b:skin>
=> Letakkan kode di bawah ini di Atas kode ]]></b:skin>

 #Enjoy{display:scroll;position:fixed;bottom:1px;right:1px;z-index:99}
    #Enjoy a{filter:alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;border:0}
    #Enjoy img{border:0}
    #Enjoy a:hover{filter:alpha(opacity=100);-moz-opacity:1;opacity:1}

=> Cari lagi kode </body>
=> Letakkan kode dibawah ini di Bawah kode </body>

<div id='Enjoy'>
    <a href='#' onClick='window.location.reload()' title='Reload page'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/refresh.png'/></a>
    <a expr:href='data:blog.homepageUrl'><img src='http://i580.photobucket.com/albums/ss248/z33s/house.png'/></a>
    <a href='#' title='Ke Atas Halaman'><img src='http://i580.photobucket.com/albums/ss248/z33s/topopg.png'/></a>
    <a href='#footbar' title='Ke bawah halaman'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/down.png'/></a>
    </div>

Ket :!!Text berwarna Merah adalah Posisi Tombol
Text berwarna Biru adalah Url Gambar. anda bisa menggantinya dengan URL gambar milik anda

=> Simpan template.
=> Selesai, dan lihat hasilnya

Warning!Jika Tombol Down / Ke Bawah tidak berfungsi, anda bisa mengganti kode #footbar dengan kode #footer atau #copyright  yang sesuai dengan HTML template anda.

Baca Juga
=> Cara memasang Widget Share Media Sosial di Blog
=> Cara Submit Sitemap Blog Ke Webmaster Tools Supaya Cepat Terindex Google
=> Tips Mudah Mendatangkan Banyak Pengunjung Ke Blog

Sekian artikel yang saya tulis ini. Semoga dengan apa yang saya tulis tentang "Cara Memasang Tombol Back To Top Di Blog" bisa bermanfaat dan berguna untuk anda. Selamat Mencoba.!!

Share :