What is the cart upsell banner?
The cart upsell banner is an optional app block that displays on your cart page. When a customer has products in their cart that are part of a bundle, the banner suggests adding the remaining products to receive the bundle discount. Example: Customer adds a phone to their cart. The banner shows: “Add a phone case and screen protector to save 20% on your purchase!”Adding the cart banner
1
Open the theme editor
Go to Online Store → Themes in your Shopify admin, click Customize on your active theme.
2
Navigate to the cart page
In the theme editor, use the page selector at the top to navigate to the cart page template.
3
Add the app block
Click Add block, scroll to the Apps section, and select Product Bundles Cart Banner.
4
Position the banner
Drag the banner block to your desired position. Common placements:
- Above the cart items list
- Below the cart items, above checkout button
- In the cart sidebar
5
Save your changes
Click Save in the top right corner.
Banner behavior
When the banner appears
The banner displays when:- Customer has at least one product from a bundle in their cart
- The customer hasn’t added all products required for the bundle
- Bundle is active and products have inventory
Multiple bundle opportunities
If cart products are part of multiple bundles:- Banner shows the highest-value opportunity first
- Customer can see other bundle opportunities by scrolling or expanding
- Each opportunity has its own “Add to cart” button
What the banner shows
- Bundle name and description
- Products already in cart (marked with checkmark)
- Products still needed (with “Add” button)
- Potential savings amount
- Quick-add buttons for missing products
Banner settings
Block settings (in theme editor)
Configure in the theme editor:- Position: Above or below cart items
- Banner style: Inline, prominent box, or subtle notification
- Dismiss option: Allow customers to close the banner
Style settings (in Product Bundles app)
Go to Settings in the app:- Colors: Background, text, button colors
- Banner copy: Customize messaging
- Call to action: Button text
Customizing the banner
Messaging
Customize the banner message to match your brand voice:- Urgent: “Don’t miss out! Complete your bundle and save 20%”
- Helpful: “You might also like these items. Buy together and save!”
- Value-focused: “Save $15 by adding these products to your cart”
- Casual: “Looking good! Add these to complete the bundle”
Visual style
Match your cart page design:- Use colors that stand out but don’t clash
- Choose a layout that fits your cart page structure
- Ensure the banner is noticeable but not annoying
Timing and dismissal
- Always show: Banner appears every time conditions are met
- Dismissible: Customers can close the banner (won’t show again in same session)
- Session-based: Reset dismissed state after customer leaves and returns
Banner effectiveness
Why cart banners work
- Timely: Customers are already in buying mode
- Relevant: Shows bundles for products they’ve already chosen
- Low friction: One click to add remaining products
- Clear value: Savings amount is prominent
Conversion tips
To maximize cart banner conversion:- Show savings first: Lead with “Save $X” or “X% off”
- Keep it simple: Don’t overwhelm with too many products
- Use urgency carefully: “Complete your bundle now” without being pushy
- Visual product previews: Show images of products to add
- One-click add: Make it as easy as possible to add products
Best practices
Don't be too aggressive
Don't be too aggressive
The cart banner should suggest, not demand. Give customers the option to dismiss it if they’re not interested.
Prioritize high-value bundles
Prioritize high-value bundles
If multiple bundles apply, show the one with the highest potential savings or best conversion rate first.
Keep messaging clear
Keep messaging clear
Explain exactly what the customer needs to do: “Add [product] and [product] to save 20%”.
Test different positions
Test different positions
Try the banner above cart items, below them, or in the sidebar. Track which position converts best.
Match cart page style
Match cart page style
The banner should feel integrated into your cart page, not like an intrusive popup.
Show product images
Show product images
Visual previews of products to add increase click-through rates compared to text-only suggestions.
Cart banner vs. product page widget
Both work together to maximize bundle conversions:
Use both: Product page widget introduces bundles; cart banner reminds customers who didn’t use the widget.
Examples
Fashion store
Cart contents: 1 dress Banner: “Complete your look! Add matching shoes and handbag for 20% off. Save $30” [Add to cart button]Electronics store
Cart contents: 1 laptop Banner: “Protect your purchase. Add a case and screen protector for $15 off.” [Quick add buttons]Beauty store
Cart contents: Cleanser, toner Banner: “You’re so close! Add moisturizer to complete your skincare routine and save 25%.” [Add button]Tracking performance
Monitor cart banner effectiveness:- Impression rate: How often banner is shown
- Click-through rate: Percentage who click “Add to cart”
- Conversion rate: Percentage who complete the bundle
- Average order value lift: Increased AOV from cart upsells
Troubleshooting
Banner not appearing:- Verify cart page app block is added in theme editor
- Check that cart products are part of active bundles
- Ensure customer hasn’t added all bundle products already
- Confirm app embed is enabled
- Check bundle product configuration
- Verify cart products match bundle requirements
- Review bundle priority settings (if available)
- Enable dismissal option so customers can close it
- Adjust frequency settings in app configuration
- Consider showing only on first cart view per session