There are two main parts to this installation:
Use our integration to connect your store to Dotdigital and sync your customers, subscribers, products, and orders. See steps 1, 2, and 3 of this article.
Manually install the scripts to your Shopify Hydrogen store front end. This is the same for any custom store setup. See step 4 of this article.
Before you start
Things you need to know:
These instructions are for Shopify Hydrogen (headless) stores only.
While connecting your store, do not choose to automatically install any scripts. For Shopify Hydrogen stores all scripts must be manually inserted into your storefront.
Integration components
Our components support four of our popular front-end tools:
Site tracking
Track the journey of any contacts who access your store using links in your email campaigns.
Web behavior tracking
Track visitor activity on your store and then view and use that data within Dotdigital. You can use this data to trigger follow-up campaigns, drive analysis and insights, power product recommendations, and make the most of our abandoned cart functionality.
Abandoned carts
Use Web behavior tracking to track abandoned carts from known customers and guests – when enabled. Merchants can set up custom automations to send triggered campaigns and personalise the customer journey using logic based on user behaviour and data.
Chat
A smart, customisable widget that sits neatly on your website. It lets your visitors communicate in real time with your team, allowing them to ask questions and get answers instantly.
1. Connect Shopify backend to Dotdigital
Go to Connect > Integrations.
In the left menu, under SHOW, select Featured.
Find Shopify, then select +ADD.
Select INSTALL.
On the Installation page, review the information and select Install app.
The installation wizard now guides you through configuring the connection between your Shopify store and your Dotdigital account.
2. Create your transactional email design
First, you can customise the design of your transactional emails, as well as your Welcome and Abandoned cart campaigns. You can ensure that these emails align with your brand by setting your colour theme, logo and email footer.
You can see a live preview of how your emails will look, using real products from your store.
Email creation
The following emails are automatically created for you inside your Dotdigital account. They’re ready to go, but you’re free to edit them if you need to make any changes:
Abandoned cart
Welcome
Shipping update
Shipping confirmation
Order refunded
Order cancelled
New order confirmation
New account confirmation
To find these emails, go to Automation > Triggered email. The campaigns are stored in a folder with the same name as your Shopify store.
If you do want to make changes to your transactional email templates, learn how in Shopify variables for transactional email templates.
3. Configure your Chat widget
In the next step, you’re given the option to set up the Dotdigital chat widget. You can choose to do this now, or return to it later.
With Shopify Hydrogen, you can design your widget now, but you must install the scripts manually. To learn how, check out the links at the end of this article.
A live preview shows you what the chat widget will look like to your site visitors.
Learn more about setting up the Chat feature in the Chat section of our Help centre.
4. Manually install the code
In this last step, you must choose to INSTALL CODE MANUALLY.
Ask your developer to install the code manually using the information on our Dotdigital for Shopify Hydrogen GitHub page and our Help Centre articles.