Installation
Chord's Shopify theme analytics library assumes that a CDP Javascript library is already installed on the site. Segment's analytics.js library is currently the only supported option. You can install Segment's analytics.js by pasting Segment's code snippet into the <head> tag of your theme. It should be added to every page of the site, so you'll likely choose to include it in layout/theme.liquid and layout/checkout.liquid (if using).
See Segment's instructions for adding the code snippet. You can find the latest version of the Segment snippet in the Overview tab of your Javascript source in your Segment workspace.
Remove analytics.page(); from the snippet after you paste it into your theme. Chord will handle calling analytics.page(); and add some extra metadata.
To install Chord's analytics snippet in your Shopify theme, create a Liquid file called snippets/chord.liquid and paste in this code:
Before the code is deployed to production, there are four variables at the top of the snippet that need to be updated with different values:
The value of STORE_DOMAIN should be the Shopify store name that comes before .myshopify.com. For example, if the store is https://chord-store.myshopify.com, it should be chord-store.
Chord will provide the values for the other three variables.
Include the Chord snippet on every page of the Shopify theme by rendering it inside the <head> tag in layout/theme.liquid:
If your Shopify checkout is customized using checkout.liquid, add the Chord snippet there as well to send an "Order Completed" tracking event from the order confirmation page. To add the Chord snippet, render it inside the <head> tag on layout/checkout.liquid, with the order_completed variable set to true:
If your Shopify checkout has been upgraded to use Checkout Extensibility, use the Web Pixel to add checkout tracking.