As discussed in the Customize Order Line Items chapter, you can add custom properties to order line items, such as a property for specifying the initials to use to monogram an item. By default, email templates that show order information do not display custom properties. This section describes how to customize these templates to display custom properties of line items. In addition, it describes how to display product IDs and SKU IDs in line items. (Note that these customizations are independent of each other; you can, for example, add the IDs without adding custom properties.)
You can modify how line items are displayed in the following email templates:
Abandon Order
Items Shipped
Order Approved
Order Pending for Approval
Order Placed
Order Quoted
Order Rejected
Payment Failure
Quote Failed
Quote Requested
Scheduled Order Placed Failed
Store Cancel Order
To add product IDs and SKU IDs to an email template, insert the following in the order items list in the html_body.ftl
file:
<br/>
Product ID : ${product.productId}
<br/>
SKU ID: ${product.catRefId}
<br/>
To add custom line-item properties to an email template, insert the following in the order items list in the html_body.ftl
file:
<#if product.dynamicProperties??>
<#list product.dynamicProperties as dynProperty>
<#if dynProperty.propertyValue??>
<br/>
${dynProperty.propertyLabel}: ${dynProperty.propertyValue}
</#if>
</#list>
</#if>
See Download and edit email templates for information about how to modify email templates.
The following example shows the order items list section of the Order Placed template, customized to display custom properties, product IDs, and SKU IDs. The customizations appear in italics:
<!-- Start of order items list--> <#list data.orderItems as product> <tr> <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #687078; text-align: left; line-height: 24px; padding: 5px 10px 5px 10px;" st-content="3col-content1" width="30%"> <img src="${product.imageLocation}" alt="${product.title!}" width="50%"> </td> <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #687078; text-align: left; line-height: 24px; padding: 5px 10px 5px 10px;" st-content="3col-content1" width="40%"> <a href="${product.location}">${product.title!}</a>
<br/>
Product
ID
:
${product.productId}
<br/>
SKU
ID:
${product.catRefId}
<br/>
<!-- Variants --> <#if product.variants??> <#list product.variants as variant> <#if variant.optionValue??> <br/> ${variant.optionName}: ${variant.optionValue} </#if> </#list> </#if>
<#if
product.dynamicProperties??>
<#list
product.dynamicProperties
as
dynProperty>
<#if
dynProperty.propertyValue??>
<br/>
${dynProperty.propertyLabel}:
${dynProperty.propertyValue}
</#if>
</#list>
</#if>
</td> <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #687078; text-align: center; line-height: 24px; padding: 5px 10px 5px 10px;" st-content="3col-content1" width="10%"> ${product.quantity}</td> <td style="font-family: Helvetica, arial, sans-serif; font-size: 14px; color: #687078; text-align: right; line-height: 24px; padding: 5px 10px 5px 10px;" st-content="3col-content1" width="20%"> ${product.price}</td> </tr> </#list> <!-- End of order items list -->