Create Email Templates

In this article: 

There are seven templates on your main app. These are;

1. Quote
2. Order Confirmation (used in the B2B e-Commerce portal)
3. Sales Order
4. Purchase Order
5. Invoice
6. Fulfilment
7. Order Notification

To create your email templates, click on the settings tab on your app manager. Click on Email Templates.

Click on the ‘New Email Template’ button on the top right hand corner of the page.

A popup such as the one below should appear;

You must fill in the name of the template and the select the type of email you intend to issue from the dropdown box. 

For the purposes of this example lets use the Sales Order template to go through the various features you can choose to include in your email.

On the right side of the page you will see a row listing various types of information that you might need to include. These are; 

1. Email
2. Issued At
3. Order Number
4. Payment Status
5. Reference Number
6. Ship At
7. Total
8. Document Link 

Each of the listed properties above contain attributes which you can use in your template. To understand how this works, let's walk through the default Sales Order email template example.

At the end of the process to create your Sales Order receipt email it should read something like this:

This is a receipt for Sales Order XYZ, issued at dd/mm/yy. The payment status is currently finalized. Please pay SGD$*** and include this reference number 1234 in any of your deposits for our records.

The italicised content is information you will need to insert into the template by inserting the information into placeholders that are wrapped in “{{ }}”.

Familiarising yourself with these placeholders, may seem daunting at first, however you should soon begin to see a recurring pattern and the process of using these placeholders soon becomes second-nature.

Let’s take a look at some of the more commonly used placeholders for a sales order template. 

Objects

{{ order_number }}

Objects contain attributes related to the property being used. In this case, the attribute "order_number" is being called upon from the Sales Order property. Since the attribute is wrapped in "{{" and "}}", it would be interpreted and displayed in the email.

Tags

{% for item in product_line_items %}

Tags make up the programming logic that tells the template what to do. Anything within "{%" and "%}" would be processed but not displayed.

In this example, this tag will generate a “context”, within this context, you are able to directly access the “item”. An item is one element in a set of product_line_items.

This would allow you to do the following:
{{item.variant.name}} - {{item.quantity}}x for {{item.price}} each.

And have it generate each order line item in an order.

Control Flow Tag

{% if notes %}

Notes: {{ notes }}

{% endif %}

Control flow tag is used to determine which block of code should run based on a condition set. In the example, the notes would be shown in the email only if it exists. Otherwise, it would be ignored. 

This is useful if you only want to render some static text (in this case “Notes: “) alongside a placeholder, when the placeholder is available. Without this, if the order has no notes, a “Notes: “ line will be in the template with no text displayed after the colon. 

Iteration Tag

{% for item in product_line_items %}

{{item.quantity}}x {{item.variant.title}}

{% endfor %}

Iteration tag is used to run a block of code repeatedly. The above example would go through each line item in the sales order and display the quantity and name of the item.

The templating system is a slight variant to Liquid, a publicly available library.

If you are curious to learn more about Liquid (and the other tags it has available), you can refer to the guide here.

Below is a list of attribute placeholders that you can add to the various templates and what they translate into in the actual email.

For Quotes or Order Confirmation

For Sales Orders

Example

{{contact.first_name}} will render the first name of the contact assigned to an order.

Sales Orders and Quotes can also be assigned to a shipping or billing address. We provide some information of these addresses for the template. 

Example

{{billing_address.address1}} will render the Address Line 1 of the address assigned to an order.

Sales Orders and Quotes can also be assigned to a company.

Example

{{company.name}} will render the name of the company assigned to an order. 

There are two types of line items, those that belong to variants (product_line_items) and Extra Line Items for other costs (such as shipping or an order wide discount).

Product Line Item (product_line_items)

Product Line Items can also access everything available to the variant.

Example

{% for item in product_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.variant.sku }}

{% endfor %}

Extra Line Item (extra_line_items)

Example

{% for item in extra_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.label }}

{% endfor %}

For Purchase Orders

Purchase Orders can be assigned to a company.

Example

{{company.name}} will render the name of the company assigned to an order.

They also have two types of line items, those that belong to variants (product_line_items) and custom ones for extra costs (such as shipping or an order wide discount).

Product Line Item (product_line_items)

Product Line Items can also access everything available to the variant.

Example

{% for item in product_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.variant.sku }}

{% endfor %}

Extra Line Item (extra_line_items)

Purchase Order Line Items without a variant attached (i.e. an extra shipping line item or an order wide discount) are considered Extra Line Items.

Example

{% for item in extra_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.label }}

{% endfor %}

For Invoices

For Product Line Items

Products Line Items belong to Order Line Items that have a variant, so both Order Line Item and variant are available here.

Example

{% for item in product_line_items %}

{{ item.quantity }}

{{ item.order_line_item.quantity }}

{{ item.order_line_item.variant.sku }}

{% endfor %}

For Extra Line Items

Extra line items belong to Order Line Items that have no variant, so Order Line Item is available here, but not variant.

Example

{% for item in extra_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.label }}

{% endfor %}

Invoices can also be assigned to a billing address.

Example

{{billing_address.address1}} will render the Address Line 1 of the address assigned to an order.

For Fulfillments

Fulfillments belong to an order, so everything on an order is accessible here.

Example

{{ order.order_number }}

Product Line Item (product_line_items)

Products Line Items belong to Order Line Items that have a variant, so both Order Line Item and Variant are available here.

Example

{% for item in product_line_items %}

{{ item.quantity }}

{{ item.price }}

{{ item.order_line_item.quantity }}

{{ item.order_line_item.variant.sku }}

{% endfor %}

Extra Line Item (extra_line_items)

Extra line items belong to Order Line Items that have no variant, so Order Line Item is available here, but not variant. This is normally used for order wide discounts or a shipping cost.

Example

{% for item in extra_line_items %}

{{ item.display_name }}

{{ item.price }}

{{ item.order_line_item.label }}

{% endfor %}

Fulfillments can also be assigned to a shipping address.

Example

{{shipping_address.address1}} will render the Address Line 1 of the billing_address assigned to a shipment. 

For Variant

For Company

For Contact

For Shipping and Billing Address