How to make stick add to cart button as back to top
-
Hello,
I’m using the **Sticky Add to Cart** feature on both mobile and desktop. How can I make it so that when the sticky Add to Cart button is clicked (on either mobile or desktop), the page scrolls up to the top or to the main Add to Cart button on the product information page before proceeding to checkout? This is because my website has several options that customers need to see before moving to the checkout page.
I only need the sticky Add to Cart button to scroll to the top or to the main Add to Cart button (similar to the “Select Options” button functionality).
Thanks
Hello,
Sorry but there is no option in Theme Settings available for that.
It requires customizations and this is beyond our limitations and support policy.
Regards.
Xtemos Studios
Hey manhten.
Did you manage to do that?
If so…can you share with me how?
Yes. You can add this JS to custom JS. (ChatGPT. :D)
`document.addEventListener(“DOMContentLoaded”, function () {
// Kiểm tra sự tồn tại của phần tử .wd-sticky-btn .wd-sticky-btn-cart
const stickyButton = document.querySelector(“.wd-sticky-btn .wd-sticky-btn-cart”);
const targetElement = document.querySelector(“.single_add_to_cart_button”);
if (stickyButton && targetElement) {
// Gắn sự kiện click cho phần tử
stickyButton.addEventListener(“click”, function (e) {
e.preventDefault(); // Ngăn hành động mặc định
// Scroll tới phần tử .single_add_to_cart_button
targetElement.scrollIntoView({ behavior: “smooth”, block: “center” });
});
}
});
Thank you very much. I will try.
Hello,
@manhten
Thanks for sharing the solution—it’ll be helpful for others too
Best Regards,
.
