Integration guide for the Impact and Prestige theme - Cart Drawer

This guide shows you how to trigger the cart drawer of the Impact and Prestige theme made by Maestrooo. The cart drawer will be opened after the bundle is being added to the cart.

If you're using Impact or Prestige v7 or newer, you can add a custom liquid or custom HTML before other BYOB app blocks and add the following code:

<script>
function afterBYOBAddtoCart(variants, variant_id) {
    document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', {
        bubbles: true
    }));
    const cartDrawer = document.querySelector('cart-drawer'); 
    cartDrawer.show();
}
</script>

If you're using older Prestige, you can add the following code:

<script>
function afterBYOBAddtoCart(variants, variant_id) {
	document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', { bubbles: true })); 
	let anchor = document.querySelector('[aria-label="Open cart"]'); 
	anchor.click(); 
}
</script>

For more technical information regarding the callback methods, please refer to the official guide.

# Update on 12/6/2024

The above code is already built into our template. It's unnecessary to include the code manually.