clearer.io

If you are using the Sticky add to cart app and want to integrate it with your theme side cart, you can do so using the provided javascript snippet.

Here are the steps to integrate the Sticky add to cart app with your theme side cart:

Navigate to the "Advanced" tab in the Sticky add to cart app admin and copy the javascript snippet provided:

conversionBearStickyBar.setCustomAddToCart((data) =&gt; {    conversionBearStickyBar.hideBar();    document.querySelector('[name="quantity"]').value = data.quantity || 1;    document.querySelector('.product-variant-id').value = data.variantId;    document.querySelector('[name="add"]')?.click();    document.querySelector('#cart-icon-bubble')?.click();});

In your theme editor, locate the file that controls your product form. This will typically be a liquid file named product-form.liquid. Look for relevant selector names indicated in the snippet above and update it with your theme values. You should update: quantity ( usually [name="quantity"]), variant id ( usually .product-variant-id]) and the add to cart button ( usually [name="add"]).

Paste the code in the custom JS input, hit Save and refresh your website to see the changes take effect.

1. Navigate to the "Advanced" tab in the Sticky add to cart app admin and copy the javascript snippet provided:
    
   conversionBearStickyBar.setCustomAddToCart((data) =&gt; {    conversionBearStickyBar.hideBar();    document.querySelector('[name="quantity"]').value = data.quantity || 1;    document.querySelector('.product-variant-id').value = data.variantId;    document.querySelector('[name="add"]')?.click();    document.querySelector('#cart-icon-bubble')?.click();});
2. In your theme editor, locate the file that controls your product form. This will typically be a liquid file named product-form.liquid. Look for relevant selector names indicated in the snippet above and update it with your theme values. You should update: quantity ( usually [name="quantity"]), variant id ( usually .product-variant-id]) and the add to cart button ( usually [name="add"]).
3. Paste the code in the custom JS input, hit Save and refresh your website to see the changes take effect.

After completing these steps, the Sticky add to cart app should now work seamlessly with your theme side cart. When a user adds an item to their cart using the Sticky add to cart bar, the quantity and variant ID of the item will be passed to your side cart and the cart icon will be clicked, showing the user their updated cart.

If you run into any issues during the integration process, please reach out to our support team for assistance.