Cart Configurations for Shopify Pages

Last updated: July 1, 2026

Learn how to configure your slide-out cart for funnels published to Shopify using Jurni's Cart Config Code, with ready-to-use snippets for common themes and cart apps.

Overview

Some themes and apps provide a built-in cart experience that isn't a full page — these carts usually slide out from somewhere on the page after a product is added, instead of redirecting to a different page.

When you publish a Jurni funnel to Shopify, you'll want your "Add to Cart" action to trigger this same cart so customers can check out smoothly without leaving your page. Jurni makes this easy with a single Cart Config Code field in your settings: set it up once for your provider, and it applies across your published funnels.

Why Cart Configuration Is Needed

Most Shopify stores don't send shoppers to a separate cart page anymore. Instead, when a product is added, a cart slides out or drops down — often called a cart drawer, mini cart, or slide-out cart.

This experience is powered by your theme or a cart app (like Rebuy), and each one opens and refreshes the cart in its own way. Your Cart Config Code tells Jurni how to trigger your specific cart so that:

  • The cart opens automatically when a customer adds a product

  • The cart contents refresh correctly

  • Customers stay on your funnel page instead of being redirected away

The Cart Config Code field supports any provider, so you can configure the exact behavior your store uses in one place.

Where to Set It Up in Jurni

  1. Go to Settings in Jurni

  2. Find the Shopify Pages section

  3. Toggle on Cart Config Code

  4. Paste the snippet for your cart provider into the code field

  5. Click Save Changes

You only need to do this once. Your cart configuration then applies to your funnels published to Shopify.

Finding Your Cart Provider

Before adding a snippet, identify which cart your store uses:

  • Using a cart app? Check your Shopify apps for tools like Rebuy, Monster Upsells, Kaching, or Slide-Cart.

  • Using your theme's native cart? Confirm your theme by opening your store, going to Dev Tools → Console, and running window.Shopify.theme.

Cart Configuration Snippets

Below is a non-exhaustive list of snippets that work today. The right one depends on your theme or cart app. If you have a custom-developed theme, your developer can provide the correct snippet.

Cart Apps

Rebuy

Rebuy's SmartCart usually opens automatically when a product is added — no extra configuration needed in most cases. If you do need to trigger it manually:

Rebuy.SmartCart.show()

Monster Upsells

window.monster_refresh();

Kaching AI Slide Cart Drawer

window.kachingCartApi.openCart();

Slide-Cart & Cart Upsells

window.SLIDECART_UPDATE();
window.SLIDECART_OPEN();

Native Theme Carts

You can verify the theme in use by running window.Shopify.theme in Dev Tools → Console anywhere on the store.

Flex Theme

Shopify.theme.jsAjaxCart.showDrawer()
Shopify.theme.jsAjaxCart.updateView()

Focal Theme

fetch("/cart.js")
.then(res => res.json())
.then(cart => document.documentElement.dispatchEvent(
     new CustomEvent('cart:refresh', {
          bubbles: true,
          detail: { cart: cart, openMiniCart: true }
    })
))

Dawn & Shrine Theme

fetch("/cart/update.js", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify({
        updates: {},
        sections: ["cart-drawer", "cart-icon-bubble"]
    })
}).then((res) => res.json()).then((cartData) => {
    document.querySelector("cart-drawer").renderContents(cartData);
    document.querySelector("cart-drawer.drawer").classList.remove("is-empty");
});

Impact Theme

const cartDrawerSlide = document.querySelector("#cart-drawer");
if (cartDrawerSlide) {
  cartDrawerSlide._onCartRefresh().then(() => cartDrawerSlide.show());
}

Horizon Theme

fetch('/cart.js')
    .then(res => res.json())
    .then(cart => {
      document.dispatchEvent(new CustomEvent('cart:update', {
        bubbles: true,
        detail: {
          resource: cart,
          sourceId: 'custom',
          data: { itemCount: cart.item_count, source: 'custom' }
        }
      }));
      customElements.whenDefined('cart-drawer-component').then(() => {
        document.querySelector('cart-drawer-component').open();
      });
    });

Impulse Theme

var cart = new theme.CartDrawer();
cart.init();
cart.open();

Motion Theme

tniReloadMinicart1();
theme._CartDrawer.drawer.open();

Third-Party Theme Carts

Smart Theme (Platter)

_cart.get(true).then(() => {
    const items = Alpine.store('cart').state.items;
    document.querySelectorAll('[data-line-item-key]').forEach(el => {
      const data = Alpine.$data(el);
      if (data?.card) data.card.line_item = items.find(i => i.key === el.getAttribute('data-line-item-key'));
    });
    _stores.modal.setId("modal--cart-drawer");
  });

Verifying Your Cart Works

After saving your Cart Config Code:

  1. Publish or update your funnel to Shopify

  2. Open the published page

  3. Click Add to Cart on a product

  4. Confirm the cart opens (slides out / drops down) and shows the correct item

  5. Proceed to checkout to confirm the full flow works

Troubleshooting

Cart doesn't open when adding a product?

  • Confirm you pasted the correct snippet for your cart provider

  • Verify your theme name by running window.Shopify.theme in the browser console

  • Make sure Cart Config Code is toggled on and saved

Customers get redirected off the page?

  • This usually means the cart isn't set to open in-page. Apply the matching snippet for your provider.

Your theme or app isn't listed?

  • If you have a custom theme, contact your theme developer for the correct cart trigger code.

If your theme or cart app isn't covered here, or your snippet isn't working, don't hesitate to reach out — contact us via Slack or at info@getjurni.ai and we'll help you find the right configuration.