IWhy This Happens
In some Shopify themes, the header has a higher z-index than Upcart, causing the cart to appear underneath it. This can make Upcart look partially hidden or inaccessible when customers open the cart.
How to Fix
Follow the steps below to bring Upcart in front of your site header:
Copy the code provided at the bottom of this article.
In your Shopify admin, go to Upcart > Cart Editor > Settings > Advanced Settings > Custom HTML.
Click the HTML dropdown and select Scripts (Before Load).
Paste the code into the field.
Click Save changes.
Refresh your storefront and test your cart.
After completing these steps, the cart should display correctly above your site header.
Code Required:
<script>
// Find UpCart
let upcart = document.querySelector("#upCart");
// Find the site's body
let body = document.body;
// If we found both
if(upcart && body)
// Move upcart to the top of the body's children so it takes priority over site header
body.firstChild.before(upcart)
</script>