Online Store Not Working Properly

Online Store Not Working Properly

Vanatri
Tourist
8 0 1

Hi everyone, I'm experiencing some issues with my Shopify and cart functionality. Particularly after interacting with the cart. For instance, If I click on the cart icon at the top of the page and then close it, I sometimes can’t scroll through the product page. There is also an occasional issue when a customer presses the checkout button, nothing happens.   Website link: https://vanatri.com/products/heart-boost-beets-supplement-1

Replies 7 (7)

wo
Shopify Partner
208 45 44

wo_0-1746752534236.png

After opening the shopping cart, this class name is added here, but it is not deleted after closing. You need to check the code of opening the shopping cart to fix this problem.

Vanatri
Tourist
8 0 1

How can I do that?

wo
Shopify Partner
208 45 44

Two methods.
One is that your shopping cart should be implemented using the app, you can disable it and use the theme's default shopping cart.

wo_0-1746770247712.png

wo_1-1746770264230.png

The second is if you want to keep the shopping cart of the app. The easiest way is to search for .overflow-hidden in base.css, there should be two places in it. Change the value to overflow-x:hidden;

But this method may cause unexpected style errors in other places where this attribute is used. You can check the page as a whole after modification.

wo_3-1746770585944.png

 

Vanatri
Tourist
8 0 1

I've done this and nothing happened, the issue is still there

Vanatri
Tourist
8 0 1

Lol, I finally fixed the issue, ChatGPT helped me fix it. it added this reinforce code to layout/theme.liquid: 

<script>
document.addEventListener("DOMContentLoaded", function() {
// Watch for cart drawer close button
document.addEventListener("click", function(e) {
if (e.target.closest("button[name='close-cart']") || e.target.closest(".cart-drawer__close-button")) {
document.body.classList.remove("overflow-hidden");
document.body.style.overflow = "";
}
});

// If cart drawer disappears for any reason (app bug), still unlock scroll
const observer = new MutationObserver(() => {
if (!document.querySelector('cart-drawer[open]')) {
document.body.classList.remove("overflow-hidden");
document.body.style.overflow = "";
}
});
observer.observe(document.body, { childList: true, subtree: true });
});
</script>

Bundler-Manuel
Astronaut
1036 51 122

Hi there @Vanatri  have you tried all possible troubleshooting mechanisms like -loading it on a different browser 

-trying it on an incognito browser

-clearing all cache cookies on the browser 

-trying to load it on different devices

If you’ve done all this already, I suggest you reach out to Shopify support and let them know about the issue.

Emmanuel
Please let me know if it works by marking it as a solution!
Bundler - Product Bundles app, a great bundle app for Shopify, with glowing user testimonials and a free plan.
Vanatri
Tourist
8 0 1

I have tried all of these, and shopify support sent me here.