Email notifications in Lightspeed eCom (E-Series) are messages sent to you and customers when a certain event happens in your online store: an order is placed, order is shipped, a product’s stock is getting low, etc. Apart from admin notifications and transactional customer emails, your store can also send automated marketing emails that timely remind customers of your business and nudge them to purchase from you.

Each email contains universal ready-to-go content. You can use templates as is or customize their appearance.

Basic email template customization can be made from Retail POS (X-Series) for all templates at once: adding a logo, changing the sender’s name or updating store info. For some of the notifications, you can also customize the email copy in a dedicated WYSIWYG text editor. Advanced notification editing will require making changes to templates in HTML, e.g., to change text formatting or color, add images, etc. 

In case you need in-depth email customization tailored to your business, you can hire the Lightspeed eCom (E-Series) custom development team to do this job.

List of eCom email notifications you can edit

There are three types of automated email notifications in your Lightspeed eCom online store: customer order notifications, marketing emails, and admin notifications. All emails can be customized either through your Retail POS settings or code.

Here’s the list of email templates that you can adjust:

Customer order notifications

• Order confirmation
• Order status changed
• Order shipped
• Order is ready for pickup
• Order delivered
• Download e-goods
• Gift card purchased
• Order refunded (Lightspeed Payments and PayPal only)
• Customer subscription notifications (for recurring subscriptions only)

Customer marketing emails

• Favorite products reminder
• Abandoned cart recovery
• Feedback request
• Loyalty appreciation
• Inactive customer reminder
• Purchase anniversary

Admin notifications

• New order placed
• Low stock notification
• New product review received (for product reviews)

Customizing email texts in the WYSIWYG editor

The built-in WYSIWYG editor allows you to easily customize the main texts of eCom email notifications. You can edit the default content, delete it, add new text paragraphs, and change the email subject to tune notifications to your tone of voice, reflect your workflow, and stand out from competitors. 

The WYSIWYG email text editor is available for the “Order confirmation”, "Order status changed", "Order shipped", "Order is ready for pickup", and "Order delivered" customer notifications, for the "Abandoned cart recovery" email, and for part of the marketing emails.

To customize email texts in the WYSIWYG editor:

1. From Retail POS, go to Online > Overview and click Go to eCom (E-Series).
2. In your eCom Admin Panel, click Settings > Notifications.

3. Click Edit next to the email you want to change:

   

4. Click on the text fields on the left and change the email content as needed.

   

   You can always restore the default content by clicking Revert to default next to each field you've customized.

5. (optional) Add new text paragraphs by entering content in the Additional text fields.
6. (for multilingual stores) Click Add or edit translations to translate your custom content into the additional eCom store languages.
7. Check the updated email copy in the preview on the right and click Save to apply the changes.

That’s it! You’ve edited the content in your notification. Customers will now get emails with updated copy. To check how the notification will look in their inbox, click Send test email at the top of the page.

To make deeper changes to your email notification, you can edit its HTML template by clicking Open HTML-editor on the WYSIWYG editor page. For example, you can change text color in your notification or add images to it.

The WYSIWYG text editor allows you to customize the default message key values used in your online store's emails. If you delete message keys from the HTML notification template, changing corresponding texts (for example, email greeting) in the text editor is no longer supported.

Understanding editing email templates in HTML

Any further edits in your email notifications will require editing the HTML template of a particular notification. This way, you can add custom messages or customize notifications in any other way, e.g., remove or add blocks, change text formatting and color, etc.

Each admin or customer email notification has its own template. When an email is sent, the email template is filled in with the info from your online store settings (store name, contact info, store link, etc.) and from the order details (customer’s name, shipping address, list of products bought, etc.) Thus, each email sent from your store is individual and contains information about a particular order and customer.

Email templates might look complicated at first, but in reality, their structure is quite plain.

If you go to Online > Webstore > Notifications in Retail POS, click Order Confirmation (or any other notification) and proceed to editing in HTML, you will see a default order confirmation email template:

You can click the Preview template link in the top left corner to see a sample email. Every part of code in the template is responsible for a specific part of this email.

You can send a test email to yourself by clicking Send test email to see how the notification looks in the mailbox.

Changing the design and the layout of the template will require some knowledge of HTML and Freemarker, but you can make small changes in the text even without that. Let’s dive deep into understanding the different parts of an email template and how to edit them: message keys (also known as rosetta keys), variables, and markups.

Message keys

If you open any email in Online > Webstore > Notifications in Retail POS for editing in HTML, you will see that there are actually no texts in the template. Instead, you can see such text labels as <@rosetta.message key="OrderConfirmation.title" />, <@rosetta.message key="OrderConfirmation.payment_status" />, etc. When an actual email is sent, these rosetta message keys are replaced with texts. You can see an email with default texts if you click Preview template.

To add a custom text instead of the default one, you need to find the necessary rosetta label (its name is usually self-explanatory) and replace the whole rosetta label with your text, then preview the result and save the changes.

For example, to replace the default “Thanks for shopping with us!” text at the bottom of your order confirmation email, you need to find <@rosetta.message key="OrderConfirmation.thanks" /> and replace it with your text (e.g., “Thank you for your purchase!”):

“Order Confirmation” email template

The WYSIWYG text editor available for part of the store's emails allows you to replace part of the default rosetta key values without touching the template code in HTML.

Here is a list of rosetta keys for the order confirmation emails (with corresponding texts):

If you don’t see the rosetta key you need for your notification in the table, try replacing this key with a test text, then click Preview template to see where the changes took place. This way, you will know what text the key is responsible for. The names of the keys also usually suggest it. You can always turn the template back to the default state afterward by clicking Revert to default.

You can delete some of the rosetta keys if you don’t want to display this information in the email notification.

Variables

Variables are placeholders that are replaced in the email with the actual information from either the order details (customer’s name, list of products, etc.) or from the store info (store name, contact info, etc.).

For example, you can see variables like ${store.name} or ${customer.name} in your email templates. As you can guess by their names, they will be replaced in the notifications with the store name taken from your eCom store profile settings (located in Settings > General > Store Profile in Retail POS) and with the customer’s name taken from the order details.

“Order Confirmation” email template

See the list of variables used in the email templates. You can delete some of the variables if you don’t want to display this information in the email notification or replace them with custom text. You can also edit or add variables that are supported in emails.

For example, if you want to show another company address in emails (not the one that you specified in your eCom store profile), you can replace the ${store.officeAddress} variable with the address that you want to show in emails by adding the latter as plain text. Or, if you're replacing a rosetta message key with some text of your own, you can include a variable as part of this text.

Markup

The text in blue, green, and red in your templates is called markup. These are rules that tell the email client how to display the text in the email: font color, size, padding, etc. You can change the markup rules if you want to change the layout and the design of your email.

Texts in grey, like <!-- Signature : start --> and <!-- Signature : end --> will help you navigate the template. This way, you can find the rosetta keys and variables you need faster.

Editing notification templates in HTML

To edit a particular email notification in HTML, you need to make changes to its template. Lightspeed eCom uses Freemarker in templates to replace variables with actual values and for their conditional rendering, while HTML tags define the structure of the email templates and how they look in the inboxes.

If you want to add a logo, update company info or change the sender’s name, it’s possible to do without the HTML-editing. For general email templates changes, please refer to the Setting up email notifications in eCom article.

To edit an email template in HTML:

1. From Retail POS, go to Online > Webstore > Notifications.
2. Click Edit next to the template you want to change.
3. In the HTML template, make changes.
4. Before saving, click the Preview template link on top to see what the email will look like.
   If you see a blank page in a preview, it most likely means that the template code was broken (some tags were accidentally deleted). If you see this, click the Revert to default link to go back to the default template and try making your changes again.
5. If you don’t like the result, click the Revert to default link at the bottom of the template to restore the default email template.
   If you are making changes to a template that you previously customized and saved, the “Revert to default” option won’t work as it will revert to the original template. To back up your template, copy the code and save it as a text file on your computer. If something goes wrong, you can paste the code from the file back to the template.
6. Once you are satisfied with the result, click Save.

Once you save changes, your email template will be updated.

For examples of customizing email templates, please refer to the Advanced customization of email templates article.

If your storefront is in multiple languages, the text that you manually add to the notification template will not be translated automatically.

Viewing an updated HTML template

You can check the new look of your template while editing and after saving changes.

While you’re replacing message keys or variables in a template, you can check the updated template by clicking the Preview template link in the top left corner:

You will see how the email will look with your changes. If you are satisfied with the result, you can save the template. Otherwise, click Revert to default at the bottom of the page to restore the default content.