Minggu, 11 Januari 2015

Cara Menambahkan Tombol Back to Top (Kembali ke Atas) Pada Blogger


Kegunaan tombol (button) kembali ke atas (back to top) adalah untuk memudahkan para pembaca blog untuk kembali ke atas atau postingan yang paling awal. Back to top ini sangat berguna bagi web blog yang mempunyai ulasan postingan sangat panjang sehingga tidak pelu menggeser scroll untuk kembali ke atas, cukup dengan menekan tombol back to top.

Cara memasang tombol back to top pada halaman blogger :
1. Copy kode berikut ini (ada dua kode, pilih salah satu).
Kode pertama (1)
<span class='back-to-top'><a href='#'> &#8593; </a></span><span class='back-to-top-a'><a href='http://www.teknologivirtual.com/'>Teknologi Virtual</a></span><style>.back-to-top {position: fixed ;bottom:20px;right:10px;z-index:9999999}.back-to-top-a {font-size:10px;z-index:9999999;opacity:0.2;position:fixed;bottom:0;}.back-to-top a {font-size: 30px ;background-color: #DD3434 ;color:#FFF;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;padding:12px 18px 20px;text-decoration: none}.back-to-top a:hover {background-color: #272727 ;text-decoration: none}</style> 
Catatan : ganti http://www.teknologivirtual.com dengan URL blog Anda.

Kode kedua (2)
<a rel="nofollow" style="display:scroll;position:fixed;bottom:10px;right:5px;" href="#" title="Back to Top"><img alt="kembali ke atas" src="http://3.bp.blogspot.com/-HrwJ5sMm0AU/VLG0m2xFFsI/AAAAAAAAAaQ/_wCu2ZFmJ4E/s1600/BackToTop.png"/></a> 
Catatan : ganti link gambar yang berwarna merah dengan link gambar Anda (mengganti tombol back to top).

2. Tambahkan Gadget > HML/ Java Script. Paste kode di atas dan simpan.

The author of the blog Teknologivirtual


EmoticonEmoticon