Email Template
You can use your own HTML email template. The template is built with Liquid, so you can include product details in the email template (such as product title and price).
You can edit or replace the email template code from your Back in Stock dashboard:
Go to Customize (1) -> Templates(2)
Then on this screen you can chose the Notification type along the top(1), or change which notification in the campaign is selected(2).
You can also change the selected language in the top right (3)
After updating your email template code you can preview the email template by sending a test email on the page(4).
Your email template is rendered using Liquid. We support basic Liquid tags (for example, if..else) as well as a number of Liquid variables. See Email template variables and filters for a list of supported variables.
Other than parsing and rendering your Liquid code we don't make any other automated changes to your code (such as a CSS inlining).
How do I change the email fonts?
Most modern email clients accept HTML in the email, but they will render emails differently than a web browser would render a web page. There are more restrictions and limitations on some elements, like fonts.
Web-safe fonts
The current desktop operating systems include a set of fonts when installed. The common fonts, available in most of the OS, are called Web-safe fonts (sometimes called default fonts). Currently, these fonts are [1]:
Best support:
- Arial
- Arial Black
- Tahoma
- Trebuchet MS
- Verdana
- Courier
- Courier New
- Georgia
- Times
- Times New Roman
Good support:
- Century Gothic
- Geneva
- Lucida
- Lucida Sans
- Lucida Grande
- MS Serif
- New York
- Palatino
- Palatino Linotype
Other fonts may be used in e-mails, but they should fallback to a web-safe font. When specifying a font list in CSS, the e-mail client will use the first available font in the list. For instance, in the following list:
Futura, Helvetica, Arial, Verdana
Futura will be rendered in the e-mail if the OS has that font installed. If not, it will use Helvetica, and so on. It is recommended to include at least one web-safe font in the list.
Custom fonts
Custom fonts are fonts that are available on the Internet and referenced via the CSS @font-face statement. These fonts don't need to be installed on the computer, they are downloaded and used at the moment the email client opens the email.
This allows us to use any font available in the Internet, but the e-mail client must support @font-face, and currently most of them don't [2]. Gmail and Google Inbox, for example, don't support custom fonts.
Adding fonts to the e-mail
When designing an email template, keep in mind that it will not look exactly the same across all email clients. This is specially true for fonts. The HTML fragment below, for example, will be rendered using Lato only if it is available. If not, it will fallback to Arial, which is a web-safe font. Finally, if Arial is not available too, sans-serif term is used to let the OS to pick the default sans-serif font.
Thank you!
[1] https://templates.mailchimp.com/design/typography/
[2] https://www.campaignmonitor.com/css/text-fonts/font-face/
How do I change the product image size in the email template?
- From your Back in Stock account choose Customize from the top menu
- Select one of the 'Send notification' steps - and press 'Edit template'.
Find the product image filter in the email template
Tip: You can use the 'Find' command in your browser (
Command + F
on a Mac,Control + F
on Windows) and search forproduct_img_url
4. You will see the size specified in quotes right after the product_img_url
filter. Change this to a different size (the quotes are required). For example, you can change product_img_url: ‘1024x1024x
to product_img_url: ‘medium’
We support the following sizes: master, 2048x2048, 1024x1024, grande, large, medium, compact, small, thumb, icon, and pico.
5. You can see the change in size in the preview panel. To save your changes hit Publish template.
How do I edit the store address included in the email footer?
The default email template will include the address for your store set in your Shopify store account.
You can easily change this with the email template editor.
- From the Back in Stock dashboard choose Customize, Email template
- Scroll down to the Footer content section
- Edit the last line to replace the template variables with the address you would like to use.
- Hit Publish template settings