Omnisend doesn't replace any of the automated notifications you are already sending through Shopify. If you wish to design your Order Confirmation, Shipping Confirmation, Abandoned Cart emails, etc., you will need to create and enable them in Omnisend. The automatic responses sent by Shopify should be disabled or replaced.
In this article, we'll explain what responses are and how they can be replaced with the emails you design in Omnisend.
Preset Automation Workflows
The list of the default automations that can be designed and sent by Omnisend includes:
If you want to avoid sending duplicated emails, you need to disable the default notifications in your Shopify account settings. Follow the instruction from Shopify Help Center.
Note! It is not possible to disable the Order Confirmation email sent by Shopify. Therefore we suggest replacing it with the Thank you note and sending this email through Omnisend. Find the instruction in the dedicated article.
However, apart from the pre-set automation workflows, you may also replace some of them by selecting the appropriate statuses in the automation trigger. For example, the Order refund notification sent by Shopify can be replaced with the automation whose trigger is set to Order Refunded.
When using the Placed Order trigger, it's essential to select the initial status of the order. For example, if the order is first marked as Authorized and later changes to Paid, your trigger should still be set to Placed Order. Then, to ensure accuracy, add a Trigger Filter based on the Payment Status or Fulfillment Status to target the correct orders within the automation.
Here's a list of how statuses are mapped between Shopify and Omnisend:
Status Type | Shopify | Omnisend |
Payment Status |
|
|
Fulfillment Status |
|
|
All of the orders with the statuses presented in the table can be designed in Omnisend. Once you enable them, you should also disable corresponding notifications in your Shopify admin.
Replacing Default Notifications
While Shopify offers a wide range of built-in automation workflows, not all of them can be recreated directly within Omnisend. However, Omnisend provides a flexible workaround that allows you to customize and replace the design of Shopify’s default notifications, giving you more control over branding and customer experience.
You can find dedicated steps guidelines below for replacing Shopify's default notifications design.
Customer Account Notifications
By subscribing to the Sign-up form, your customer opts-in to receive your marketing. However, when creating an account in your store, the customer is not getting Subscribed status that is required to start sending promotional messages. Omnisend is not able to send notifications related to the customers' accounts, nevertheless, you can replace its design.
As you may see from the screenshot, the most critical parameter in this message is the URL for the password reset.
To find the anchor attached to the button, you may search with the name of the button.
Later this anchor should be added to the code for the button designed in Omnisend.
Customer account welcome: {{ shop.url }}
Customer account password reset: {{ customer.reset_password_url }}
Customer account invite: {{ customer.account_activation_url }}
Simple Notifications
Among all of the notifications, we've selected those having a simple design.
Return label instruction: {{ return_label.public_file_url }}
Payment error: {{ url }}
Gift card created: {{ gift_card.url }}
Personalized Anchors
Customer Name: {{ customer.first_name }}
Order Name: {{ order_name }}
Order Number: {{ order_number }}
Replacing the Design in Shopify
There isn’t a direct option to export the HTML code of an email message. However, you can access it in the Thank You message builder by clicking the Get HTML button.
To do this, create a temporary Order Confirmation email to open the builder. You don’t need to enable this automation, you can delete it right after copying the HTML code.
Once you’re in the builder, you can create your own custom design before exporting the HTML.
When happy with the email message design, you should click on the GET HTML button and go to your Shopify Notifications settings.
As you may see from the HTML code, each of the message blocks starts with a new line. Therefore when adding the code for the button, you can easily understand where exactly this code should be placed.
In the example presented above, we have the pre-header, Image (cb-1), Title (cb-2), Text (cb-3), Footer (cb-4) and Badge (cb-5). If we want to place the button below the image, the code should be added below cb-1 element.
Feel free to experiment; you can always check the Preview and restore the default settings if something goes wrong.
Before one of the line starting with </div><div class the code for the button should be added to the template:
</div><div class="cb cb-2 cb-title"><table border="0" cellspacing="0" cellpadding="0" width="100%"><tr>
<td style="background-color:#fff;" bgcolor="#fff"><table border="0" cellspacing="10" cellpadding="0" width="100%"><tr>
<td style="padding-bottom:25px;padding-left:150px;padding-right:150px;padding-top:25px;"><div class="cbvariant cbvariant-center"><table border="0" cellpadding="0" cellspacing="0" width="100%"><tr>
<td style="background-color:#fff;" bgcolor="#fff" class="actions__cell" style="font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;">
<td class="button__cell" style="font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; border-radius: 4px;" align="center" bgcolor="#2CA6A1"><a href="{{ customer.reset_password_url }}" class="button__text" style="font-size: 16px; text-decoration: none; display: block; color: #fff; padding: 5px 5px;">Reset your password</a></td></tr></table></div></td></tr></table></td></tr></table>
For each of the notification, the anchor assigned to the href= attribute, and the title of the button should be replaced. For example, for the Password reset we have:
href="{{ customer.reset_password_url }}"
>Reset your password<If you change the color of the template, you need to change it for bgcolor and background-color elements, except for the one within the button settings.
To change the width of the button, you should change the padding-left:150px and padding-right:150px.
To change the size of the block with the button, you should change padding-bottom:25px and padding-top:25px.
The customer account invite message allows one to add custom text for each of the customers individually. To support this option in the replaced HTML code, the following code should be added to the HTML code.This code should be added to the element with the default text before </p> tag.
<h2>{{ email_title }}</h2>
{% if custom_message != blank %}
<p>{{ custom_message }}</p>
{% else %}
<p>{{ email_body }}</p>
{% endif %}
<table class="row actions">
Here is the screenshot from the builder:
As you may see from the code presented above, we have also added a personalization to insert customers' first names to the content of the email message.
Have more questions? Feel free to contact us at [email protected] or via in- app chat.