--- title: Integrate with Shopify slug: js-api/integrate-with-shopify description: How Monetate JavaScript API clients can integrate with Shopify image: https://archbee-image-uploads.s3.amazonaws.com/ceIfEvQHzQk1IVxoRWUh7/K9eTL4jKm7UQINb6zNziJ-20250912-181225.png docTags: createdAt: 2024-07-01T15:35:23.664Z --- If you're also a Shopify client, you can implement Monetate on your Shopify site. :::hint{type="info"} This implementation currently doesn't include tracking conversions on the order confirmation page. ::: ## Step 1: Add the Monetate Tag to theme.liquid Follow the steps in [Installing the Tag](docId\:zcx_p3d6ND2Rr5bJLOyUG) to obtain and then paste the version of the Monetate tag that you're using as the first script tag in the `` element of your Shopify `theme.liquid` [layout](https://shopify.dev/docs/storefronts/themes/architecture/layouts). :::CodeblockTabs Example of Synchronous Monetate Tag in \ of Shopify theme.liquid Layout ```html ``` ::: ## Step 2: Create a monetate.liquid Snippet Navigate to the [snippets](https://shopify.dev/docs/storefronts/themes/architecture#snippets) directory, click **Add a new snippet**, name it `monetate.liquid`, and then paste the following code into it. This code sends all the necessary method calls depending on page type, except for checkout and purchase page types. :::hint{type="info"} Follow the steps in [Connect Shopify Checkout Extensibility to Monetate](docId\:CDUMllk01FDOM8YWRV54y) to create a custom pixel to pass checkout and purchase data to Monetate. ::: :::CodeblockTabs Code for monetate.liquid Snippet ```html {% if template.name == 'search' %} {% endif %} {% if template.name == 'collection' %} {% elsif template.name == 'product' %} {% elsif template.name == 'search' %} {% elsif template.name == 'home' %} {% else %} {% endif %} ``` ::: ## Step 3: Add the Snippet to theme.liquid Insert the following code before the `` tag of `theme.liquid` to render the `monetate.liquid` snippet. :::CodeblockTabs Example of setPageType Method Added to Shopify collection-template.liquid ```html ... ... {% render 'monetate' %} ``` ::: See Shopify's [developer documentation](https://shopify.dev/docs) for more information about its [Liquid template language](https://shopify.dev/docs/api/liquid). ## Step 4: Implement Retracks Any time a customer makes changes to a page of your site while shopping (for example, applying filters to search results), you must perform a retrack to make Monetate aware of the new data present. These retracks enable personalized experiences. Implementing retracks is straightforward. Refer to [Page Retracks](docId\:z7zs1BulqPT_0Z1CoYHww) for instructions.