To add a "Back to Top" button on your Blogger blog, you can follow these steps:
1. Go to your Blogger Dashboard and click on "Theme" from the left-hand menu
2. Click on "Edit HTML".
3. Scroll down the code until you find the closing </body> tag.
4. Paste the following code just above the </body> tag:
htmlCopy code
<div class="scroll-top"> <!-- SVG Icon --> <svg height="24px" viewBox="0 0 24 24" width="24px" xmlns="http://www.w3.org/2000/svg"> <path d="M4,12l1.41,1.41L11,7.83V20h2V7.83l5.58,5.59L20,12l-8,-8 -8,8z"></path> </svg></div>jsCopy code
<script> var sbt = document.querySelector(".scroll-top"); window.onscroll = function () { sbt.classList.toggle("active", window.scrollY > 380); sbt.onclick = function () { window.scrollTo({ top: 0, behavior: "smooth" }) } }</script>5. Scroll up the code until you find the closing </head> tag.
6. Paste the following code just above the </head> tag:
cssCopy code
<style> .scroll-top { position: fixed; right: 30px; bottom: -50px; background: #0084ff; padding: 6px 5px; border-radius: 4px; transition: all 0.3s; } .scroll-top svg { fill: #fff; } .scroll-top:hover { box-shadow: 0 0 20px #0084ff; cursor: pointer; } .scroll-top.active { bottom: 30px; }</style>7. Save your changes and exit the code editor. and view your blog to see the "Back to Top" button.
Thankyou, 🙂
Your tutorials are amazing 💯
keep going👍
good