Add-to-cart (ATC) Integration

Tangiblee’s widget should trigger a click on the ATC button, this is easier to achieve when the ATC button is located within the widget.

As Shopify themes are unique, adding the ATC requires some actions on the store owner’s side.

Please watch the short video below and follow the guidelines on how to mark ATC with unique HTML attribute: tangiblee-atc="true" in order for the ATC to appear in the Tangiblee widget.

1. Select Theme in Online Store settings in your Shopify admin panel.

2. Tap the 3 dots button and select Edit code.

3. Search pages by “product” key word.

ATC code shall be located on one of these pages, depending on the theme you’re using. Typically, it can be main-product.liquid or product-template.liquid.

4. Open a Product Detail Page(PDP) in a separate tab and open dev tools/Element. Click on the ATC button on the PDP to see the code related to it on dev tools. It will be the indicator when looking where to place the tangiblee-atc="true" attribute in the code.

5. Go back to code editing, and search for “button”, “product-form” or another indicator to help locate the ATC code. Insert tangiblee-atc="true" in the end of the line before > and press Save.

6. Refresh the PDP and inspect  the ATC again to check if the attribute has been connected to the ATC.

Should you have any questions, please, contact us at success@tangiblee.com or provide collaborator access so that we can assist you.