Add product recommendations to your cart
Updated today
Show a scrollable list of related or complementary products on your cart page, cart drawer, or both, and let shoppers add them directly from the cart. Add the Cart upsell carousel block on the cart page or the Cart drawer upsell carousel block in the drawer; both share the same settings. The slider appears only while the cart has items, is based on the most recently added cart item, and hides any products already in the cart.
Add the slider to the cart page
On the cart page the upsell block lives in the Cart footer (top) area of the main cart section, before the free shipping bar.
In the Shopify theme editor, open the Cart page template.
In the main cart section, add the Cart upsell carousel block to the Cart footer (top) area.
Add the slider to the cart drawer
In the drawer the upsell block sits beneath the cart lines, and the drawer shows it only when your Cart type is set to Drawer. See Cart drawer for how the drawer is assembled.
In the Shopify theme editor, open the Cart drawer under the Drawers group.
Add the Cart drawer upsell carousel block after the Cart items block.
Choose the recommendation type and product count
Recommendation intent sets which products Shopify returns for the most recently added cart item, and Products to show sets how many display. Shopify explains how related and complementary recommendations are generated and configured.
Recommendation intent: Related (default) or Complementary.
Products to show: from 2 to 10 (default 6).
Customize the heading and appearance
Set the heading text, the image shape, and an optional color scheme for the slider.
Heading: the text above the slider (default "You might also like").
Aspect ratio: Natural (default), Square, Landscape, or Portrait.
Enable color scheme: off by default. Turn it on to reveal the Color scheme selector.
Adjust desktop and mobile spacing
Control the space above the slider and hide it on a given screen size.
Margin top (Desktop) and Margin top (Mobile): from 0 to 34 (default 0).
Hide block on desktop and Hide block on mobile: off by default.
How shoppers add recommended products
A recommended product with a single available variant adds straight to the cart with its Add to cart button. A product with multiple variants, or one that is unavailable, opens the Quick add panel so the shopper can choose options first.
On the cart page, adding a recommendation reloads the cart page. In the drawer, the drawer updates in place without a page reload.
The slider hides when fewer than two products remain after the items already in the cart are filtered out.