SScale Themedocs
FR

Product recommendations in the cart to increase average order value. 3 data sources and full customization.

Cart Upsells

Cart Upsells are product recommendations displayed in the cart (drawer or page) to encourage the customer to add complementary items. It is one of the most effective levers for increasing average order value.

Activation

SettingDescriptionDefault
Enable upsellsActivates product recommendationsNo
TitleSection title"Complete your order"

Product Source

SettingOptionsDefault
SourceRecommendations / Collection / ProductsRecommendations

Recommendations (automatic)

Uses the Shopify Product Recommendations API to display relevant products based on the current cart contents.

💡The Recommendations mode is the most effective because it automatically adapts to the cart contents. The displayed products are different for each customer.

Collection (manual)

Displays products from a specific collection:

SettingDescription
CollectionThe source collection for upsells

Products (manual selection)

Allows manually selecting the products to display:

SettingDescription
ProductsProduct list (max 8)

Number of Products

SettingDescriptionDefault
LimitMaximum number of products displayed (2-8)4

Position in the Drawer

SettingOptionsDefault
PositionScroll / FixedScroll

Scroll

Upsells are placed in the scrollable body of the drawer, below the cart items. The customer must scroll to see them.

Fixed

Upsells are placed in the fixed footer of the drawer, always visible above the checkout button.

and in fixed position (in the footer, always visible))

ℹ️The Fixed position is more visible but takes up space in the footer. Recommended if you have few upsells (2-3). The Scroll position is preferred for more products.

Mobile Display

SettingOptionsDefault
Mobile displayShow / Collapsed / HideCollapsed
OptionDescription
ShowAlways visible on mobile
CollapsedCollapsed by default, expandable via a chevron button
HideCompletely hidden on mobile
💡The Collapsed mode is the best compromise on mobile: upsells don't take up space but remain accessible. The title is displayed with a chevron to reveal the suggestions.

Button Style

SettingOptionsDefault
Button stylePrimary / Secondary / TertiarySecondary

How It Works

Each upsell product displays:

  • Product image (thumbnail)
  • Product title
  • Price (with crossed-out price if applicable)
  • Quick add button

When the customer clicks the button:

  1. The product is added to the cart via the Shopify API
  2. The drawer updates immediately
  3. The cart counter is incremented
  4. Upsells refresh (if in Recommendations mode)

Skeleton loading

In Recommendations mode, upsells display skeletons (animated placeholders) while the recommendations load. The experience is smooth with no content "flash".

Use Cases

  • Source: Recommendations
  • Limit: 4
  • Position: Scroll
  • Mobile: Collapsed
  • Button: Secondary

Specific collection

  • Source: Collection ("Accessories")
  • Limit: 3
  • Position: Fixed
  • Mobile: Show
  • Button: Tertiary

Manual selection

  • Source: Products (warranty, protection, gift wrapping)
  • Limit: 3
  • Position: Fixed
  • Mobile: Show
⚠️Upsells do not automatically filter out products already in the cart when in Collection or Products mode. In Recommendations mode, Shopify handles this logic automatically.

Difference from Quick Add

Cart UpsellsQuick Add
FormatFull product card (image, title, price)Compact button with label
SourceRecommendations, collection, or productsManual products only
Max products85
PositionScroll or FixedFooter only
UsageComplementary recommendationsQuick add-ons (protection, wrapping)
PreviousFree GiftNextFly to Cart