Cara Membuat Smooth Back To Top di Blogger - Kenapa harus memasang tombol back to top pada blogger? jawabannya adalah karena back to top dalam blogger bertujuan agar mempermudah para visitor atau pengunjung untuk menuju bagian atas sebuah website dengan mudah, yaitu hanya dengan satu sentuhan atau klik. Tombol back to top ini biasanya digunakan pada blog dengan artikel yang panjang. Untuk membuat smooth back to top di blogger ini yang harus Anda lakukan yaitu :
- Login ke blogger.com seperti biasa, lalu masuk ke Template > edit HTML.
- letakkan kode di bawah ini sebelum ]]></b:skin> atau </style>
#back-to-top {
background:#4399CD;
color:#fff;
padding:8px 10px;
font-size:24px;
}
.back-to-top {
position:fixed !important;
position:absolute;
bottom:20px;
right:20px;
z-index:999;
}
- kemudian tambahkan kode di bawah ini sebelum </body>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'/>
<div class='back-to-top'><a href='#' id='back-to-top' title='back to top'>
<i class='fa fa-chevron-up'/>
</a></div>
<script>
$(window).scroll(function() {
if($(this).scrollTop() > 200) {
$('#back-to-top').fadeIn();
} else {
$('#back-to-top').fadeOut();
}
});
$('#back-to-top').hide().click(function() {
$('html, body').animate({scrollTop:0}, 1000);
return false;
});
</script>
- hapus kode yang berwarna merah di atas apabila telah terpasang di blog.
- Simpan template dan lihat hasilnya
Jika ada sebuah pertanyaan yang ingin disampaikan, saya akan senang untuk menjawabnya dengan semampu saya. Semoga bermanfaat :).