When Fin for Ecommerce adds or changes an item, it updates the cart in your store. This works by default on most themes. If your cart doesn't update, the fix is below.
Supported themes
Your cart stays in sync automatically on Dawn, Horizon, Brooklyn, Flex, Flow, Venue, Sense, Craft, Refresh, and themes built on them. Many others, including Focal, Prestige, and Warehouse, are handled too.
Note: Support depends on how your theme is built, not on its name, so a heavily customized theme may still need the step below.
If your storefront cart doesn't update
If Fin's changes never reach your cart, or only appear once the shopper reloads the page, your theme refreshes its cart in a way Intercom can't detect. This is most common on custom themes.
Note: Adding this snippet requires Shopify admin access and basic familiarity with editing theme code. If you're not comfortable editing theme files, share this article with your developer.
To fix it, add the snippet below to your theme. It listens for a browser custom event (intercom:cartUpdated) that Fin dispatches whenever it changes the cart, then re-fetches the cart from Shopify and fires whichever events your theme uses to re-render it.
In your Shopify admin, open the code editor for your live theme.
Open your main layout file, usually layout/theme.liquid.
Paste the snippet just before the closing
</body>tag, then save.Test it by asking Fin to add a product. Your storefront cart should update immediately, without a page reload.
document.addEventListener('intercom:cartUpdated', async () => {
try {
const res = await fetch(`${window.Shopify.routes.root}cart.js`, {
headers: { Accept: 'application/json' },
cache: 'no-store',
});
if (!res.ok) return;
const cart = await res.json();
// Replace these with whatever your theme uses to re-render the cart.
document.dispatchEvent(
new CustomEvent('cart:live', { detail: cart, bubbles: true })
);
document.dispatchEvent(
new CustomEvent('cart:reload', { bubbles: true })
);
document.documentElement.dispatchEvent(
new CustomEvent('cart:refresh', { bubbles: true })
);
} catch {
// Cart fetch failed. Leave the storefront cart as it is.
}
});
Change the last three dispatches to call whatever your theme uses to re-render the cart.
If the cart still doesn't update after adding the snippet, check that the custom event names in the last three dispatches match the ones your theme listens for. Your theme's JavaScript files or documentation will show which events it uses to re-render the cart. If you're unsure, share this article with your developer.
Need more help? Get support from our Community Forum
Find answers and get help from Intercom Support and Community Experts