Overview
By default, Upcart places upsells and add-ons near the footer of the cart. This tutorial shows how to reposition them so they appear immediately after the product list, making them more visible and increasing the likelihood of engagement.
This layout change can improve conversion by displaying complementary offers right after customers review their cart contents.
Where to find the custom CSS editor
Go to Upcart > Cart Editor > Settings > Custom CSS
Scroll to the input field and paste the code below
Click Save
Refresh your storefront to view the changes
CSS to reposition modules
[class*="styles_CartPreview__bottomModules__"] { margin-top: 0px; }This code removes extra spacing above the upsell and add-on section so it appears directly after the product list.
Optional enhancements
You can combine this adjustment with:
Upsell styling (background colors, padding, or borders)
Add-on highlight styles
Scroll anchors or animations for smoother appearance
Still need help?
For additional customization, we recommend working with a Shopify Expert. They can help with HTML, CSS, or JavaScript in your cart drawer.