[Solved] How To Add Auto Scroll To Top For All Shopify Themes [ 100% Working Solutions]

[Solved] How To Add Auto Scroll To Shopify Theme [ 100% Working Solutions]

Go to theme Editor
Go to snippets folder and create a file
Paste the provided code in auto_scroll.liquid file
render this file in theme.liquid file at end of the body tag
<script>
   let bodyElement = document.querySelector("body");
   
   let scrollElement = document.createElement("div");
   
   scrollElement.setAttribute("hidden", true);
   
   scrollElement.setAttribute("title", "Click for go to Top ");
   
   bodyElement.setAttribute("onscroll", "myFunction()")
   
   scrollElement.classList.add("scrollTop-style");
   
   scrollElement.innerHTML = `<img src="_IMAGE URL_" class="scroll-top" height="48px" width="48px" />`;
   
   scrollElement.style.cssText = `position: fixed; top: calc(93% - 12px);right: 0;`;
   
   bodyElement.after(scrollElement);
   
   let scrollTop = () => {bodyElement.scrollIntoView({behavior: "smooth"});}
   
   window.onscroll = () => {
   
   if (document.documentElement.scrollTop > 70) {
   
   scrollElement.removeAttribute("hidden");
   
   scrollElement.addEventListener("click", scrollTop);
   
   } else {scrollElement.setAttribute("hidden", true);}};
   
</script>
Now Enjoy Automatic Scroll To Top

Leave A Comment

0

At vero eos et accusamus et iusto odio digni goikussimos ducimus qui to bonfo blanditiis praese. Ntium voluum deleniti atque.

Melbourne, Australia
(Sat - Thursday)
(10am - 05 pm)
Melbourne, Australia
(Sat - Thursday)
(10am - 05 pm)

No products in the cart.

X
×

Hello!

Click one of our contacts below to chat on WhatsApp

× How can I help you?