Cara Membuat Back to Top pada Blog



Back to Top adalah sebuah tombol yang tersedia pada blog ketika blog kita di scroll ke bawah. maka tombol back to top tersebut akan tampil. Kegunaan tombol ini adalah untuk  kembali ke atas dari sebuah halaman blog. misalnya dalam blog andryemos ini, coba agan scroll ke bawah, akan muncul tombol back to top nya di sisi kanan bawah. bagai mana cara memasangnya??? langsung aja lihat ke bawah.

1. Masuk ke dashbord blog agan
2. Pilih Template > edit html (back up dulu sebelum di edit)
3. Cari kode </head>, setelah ketemu letakkan kode di bawah ini di bawah kode </head>
<script type='text/javascript'>
$(document).ready(function(){

// hide #back-to-top first
$(&quot;#back-to-top&quot;).hide();

// fade in #back-to-top
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() &gt; 100) {
$(&#39;#back-to-top&#39;).fadeIn();
} else {
$(&#39;#back-to-top&#39;).fadeOut();
}
});

// scroll body to 0px on click
$(&#39;#back-to-top a&#39;).click(function () {
$(&#39;body,html&#39;).animate({
scrollTop: 0
}, 800);
return false;
});
});

});
</script>
4. Kemudian cari kode </body>, setelah ketemu letakkan kode di bawah ini di bawah kode </body>
<div id='back-to-top'>
<a href='#' rel='nofollow' style='float: right; padding-right:26px; z-index: 999999;bottom:10px;right:30px; position: fixed;' title='Back to Top'><img src='http://i1089.photobucket.com/albums/i346/andryemos/backtotop4.png'/></a></div>
5. Pratinjau terlebih dahulu sebelum di simpan. Kalau serasa cocok. simpan template.
6. Selamat, blog sobat udah ada back to top nya.. :D

Subscribe to receive free email updates:

0 Response to "Cara Membuat Back to Top pada Blog"

Post a Comment