Quickstart guide to Upcart

Learn how to activate Upcart, enable core features, and publish your cart drawer live.

This guide walks you through setting up Upcart with its main modules, from visual customization to activation on your storefront.

Upcart replaces your theme cart drawer visually, but it does not integrate with your theme’s cart drawer or cart page. The Shopify cart page will still be accessible.

Managing Modules

Each Upcart module can be easily enabled or disabled. Simply click on the Enable/Disable button in the top-right corner to turn a module on or off at any time. Your changes take effect immediately once saved.

Cart design

When you first open Upcart’s Cart Editor, you’ll land in the Design module. Here you can customize the base colors of the drawer to match your store branding.

Announcements

To display a cart message or countdown timer, go to Body > Announcements.

In the top right corner, click Enable. The badge beside the module name changes from Disabled to Active.

Enter your message into the Announcement Text field and configure the timer if needed.

Make sure to use the {TIMER} variable for countdowns within your announcement text to ensure proper functionality (e.g., “This offer is only available for .”) Avoid copying formatted text directly from third-party tools.

Once you’re done, make sure to click Save in the top-right corner.

Theme-Level Issues

• CSS or App Conflicts: Ensure that CSS properties like display: none; are not hiding the announcement bar. Also, check that third-party apps are not overriding these settings.
• Text Visibility: Confirm the announcement bar text color contrasts with the background and adjust it in your theme settings if necessary.

Advanced Debugging Steps

For persistent issues, review browser console errors for script problems affecting the announcement bar and disable third-party apps temporarily to pinpoint conflicts.

Rewards

To display a progress bar that encourages customers to spend more, enable the Rewards Module.

General settings

Set your branding colors and the message shown after the final reward tier is reached.

Choose a reward basis in the Rewards calculation card below General settings:

• Cart total ($): Tracks total cart value
• Cart quantity (#): Tracks quantity of items

Tier settings

Choose your reward type:

• Shipping: Unlocks free shipping at the tier
• Discount: Unlocks a discount at the tier
• Product: Adds a product to the cart

Whether tier progress is measured before or after discounts is set once for the whole bar, with the Use pre-discounted prices for cart total checkbox in Rewards calculation — it is not a property of the reward type.

Set a minimum threshold to trigger the reward and customize the Title before achieving tier field. You can create up to four reward tiers.

This screenshot predates the current labels: it shows the section as “Rewards settings” and the field as “Text before achieving”. The controls are the same ones — they now read Tier settings and Title before achieving tier.

Upsells

Enable Use AI Recommended Upsells, select the Related algorithm, and turn on Smart Variant Matching to preselect matching product variants based on the cart contents.

Customize your section title and the Add button label.

Add-ons

To show a toggle-based add-on in the footer, you can enable either of these options:

Shipping protection

Select Shipping Protection and configure dynamic pricing tiers based on cart value.
This creates a real product in your Shopify catalog.

Product add-on

Switch to the Product Add-On tab and select an existing product to offer as an upsell.

Activating Upcart on your store

Step one: Make your cart live

Once everything is configured, go to Manage All Carts > select the cart you want to make active > click Publish.

Once published, the cart moves to the live section of the carts table. It shows a warning “App embed off” badge until you enable the Upcart app embed in your theme, which is the next step. With the embed on, the badge becomes a green “Live” badge confirming the cart is showing on your storefront.

The app embed controls whether the Upcart cart drawer displays on your storefront. If you have Discounts configured, those rules remain active through Shopify’s discount system even when the app embed is disabled.

Step two: Enable Theme App Embed

To activate Upcart on your theme, go to Shopify Admin → Online Store → Themes → Customize → App embeds, enable the Upcart app embed, and click Save.

If you encounter any issues or experience compatibility problems, feel free to contact our Support Chat for assistance.