Butang Kembali ke Atas (Back to Top Button) untuk Blogger
Butang Kembali ke Atas (Back to Top Button) untuk Blogger
Langkah 1: Masuk dan Edit HTML Blogger
-
Log masuk ke akaun Blogger anda.
-
Pergi ke menu Tema.
-
Klik Edit HTML.
-
Cari kod
</body>di bahagian bawah (gunakanCtrl + Funtuk cari dengan cepat).
Langkah 2: Tampalkan Kod Ini Sebelum </body>
<!-- Mula: Butang Kembali ke Atas -->
<a href="#" id="butang-ke-atas" title="Kembali ke atas">↑</a>
<style>
#butang-ke-atas {
position: fixed;
bottom: 40px;
right: 40px;
display: none;
background: #3498db;
color: white;
padding: 10px 15px;
font-size: 18px;
border-radius: 5px;
text-align: center;
z-index: 1000;
cursor: pointer;
text-decoration: none;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
#butang-ke-atas:hover {
background: #2980b9;
}
</style>
<script>
// Paparkan/sembunyikan butang
window.addEventListener('scroll', function() {
var scrollBtn = document.getElementById('butang-ke-atas');
if (window.scrollY > 300) {
scrollBtn.style.display = 'block';
} else {
scrollBtn.style.display = 'none';
}
});
// Tatal ke atas dengan lancar
document.addEventListener('DOMContentLoaded', function() {
var scrollBtn = document.getElementById('butang-ke-atas');
scrollBtn.addEventListener('click', function(e) {
e.preventDefault();
window.scrollTo({top: 0, behavior: 'smooth'});
});
});
</script>
<!-- Tamat: Butang Kembali ke Atas -->
Langkah 3: Simpan Tema
Setelah menampal kod di atas, klik Simpan atau Save di bahagian atas kanan skrin.
Nota Tambahan:
-
Anda boleh menukar warna butang (ruangan background dan hover) supaya selaras dengan tema blog anda — contohnya biru pastel untuk gaya #JMBELOG.
-
Anda juga boleh ubah simbol ↑ kepada teks seperti "Kembali ke Awal" atau gunakan simbol lain seperti ⬆️ atau 💫 untuk kelihatan lebih lembut dan puitis.
Ulasan
Catat Ulasan
“Untuk anda yang singgah… tinggalkanlah jejak, tinggalkanlah yang baik-baik, walau sekecil rasa, walau sependek kata.
Kerana setiap kehadiran itu, ada makna yang tak selalu terlihat oleh mata. Dan setiap kata yang kita tinggalkan, akan kembali kepada kita dalam bentuk yang sama.”