⚠️ Important notice
This customization only works with Version 1 of the Upcart cart modules. If you recently upgraded your cart to Version 2, these customizations may not work. You will need to use the new selectors provided for Version 2 in the migration guide.
If your customizations are not working as expected, you can also revert your cart back to Version 1 instead of using Version 2.
We are currently working on new customization templates for Version 2 of the modules, and they will be available soon.
Overview
This customization uses CSS to disable links on product titles and images in the cart drawer and upsell section. It helps keep the focus on completing checkout and prevents customers from leaving the cart to view product pages.
This is also useful for stores that offer exclusive upsell items that should not be accessed outside the cart.
Why this is useful
Reduces friction and keeps customers focused on checkout
Prevents navigation away from the cart, especially on mobile
Limits exposure of upsell-only products not meant to be browsed elsewhere
Where to find the custom CSS editor
Go to Upcart > Cart Editor > Settings > Custom CSS
Scroll down to the input field and paste your code
Click Save
Refresh your storefront to preview the change
Example CSS to disable clickable links
.upcart-product-title-link, .upcart-product-image-wrapper a, .upcart-upsell-item-card a { cursor: none !important; pointer-events: none !important; }This CSS will:
Remove pointer functionality from product titles and images
Prevent customers from clicking through to product detail pages
Keep the styling and layout the same (only the interaction is disabled)
Need help?
Upcart’s support team does not provide assistance with custom CSS implementation. For advanced setup or styling, we recommend working with a Shopify Expert.