You are on page 1of 5

{%​ i ​ f​ fulfillment​.

​item_count ​==​ item_count ​%}


​{%​ capture shipment_name ​%}​Your​ order ​is​{%​ endcapture ​%}
{%​ ​elsif​ fulfillment​.​item_count ​>​ ​1​ ​%}
​{%​ ​if​ fulfillment_status ​==​ ​'fulfilled'​ ​%}
​{%​ capture shipment_name ​%}​The​ ​last​ items ​in​ your order are​{%​ endcapture ​%}
​{%​ ​else​ ​%}
​{%​ capture shipment_name ​%}​Some​ items ​in​ your order are​{%​ endcapture ​%}
​{%​ endif ​%}
{%​ ​else​ ​%}
​{%​ ​if​ fulfillment_status ​==​ ​'fulfilled'​ ​%}
​{%​ capture shipment_name ​%}​The​ ​last​ item ​in​ your order ​is​{%​ endcapture ​%}
​{%​ ​else​ ​%}
​{%​ capture shipment_name ​%}​One​ item ​in​ your order ​is​{%​ endcapture ​%}
​{%​ endif ​%}
{%​ endif ​%}

{%​ capture email_title ​%}{{​ shipment_name ​}}​ on the way​{%​ endcapture ​%}
{%​ capture email_body ​%}{{​ shipment_name ​}}​ on the way to you​.​ ​Track​ your shipment to see the
delivery status​.{%​ endcapture ​%}
{%​ capture email_emphasis ​%}​Estimated​ delivery date​:
<strong>​{{​fulfillment​.​estimated_delivery_at ​|​ date​:​ ​"%B %d, %Y"​}}</​strong​>{%​ endcapture ​%}

<!DOCTYPE html>
<html​ ​lang​=​"en">
​<head>
​<title>​{{ email_title }}​</title>
​<meta​ ​http-equiv​=​"Content-Type"​ ​content​=​"text/html; charset=utf-8">
​<meta​ ​name​=​"viewport"​ ​content​=​"width=device-width">
​<link​ ​rel​=​"stylesheet"​ ​type​=​"text/css"​ ​href​=​"/assets/notifications/styles.css">
​<style>
​.​button__cell ​{​ background​:​ ​{{​ shop​.​email_accent_color ​}};​ }
a​,​ a​:​hover​,​ a​:​active​,​ a​:​visited ​{​ color​:​ ​{{​ shop​.​email_accent_color ​}};​ }
​</style>
</head>

​<body>

​<table​ ​class​=​"body">
​<tr>
​<td>

<table​ ​class​=​"header row">


​<tr>
​<td​ ​class​=​"header__cell">
​<center>

​<table​ ​class​=​"container">
​<tr>
​<td>
​<table​ ​class​=​"row">
​<tr>
​<td​ ​class​=​"shop-name__cell">
​{%​ ​if​ shop​.​email_logo_url ​%}
​<img​ ​src​=​"{{shop.email_logo_url}}"​ ​alt​=​"{{ shop.name }}"​ ​width​=​"{{
shop.email_logo_width }}">
​{%​ ​else​ ​%}
​<h1​ ​class​=​"shop-name__text">
​<a​ ​href​=​"{{shop.url}}"​>​{{ shop.name }}​</a>
​</h1>
​{%​ endif ​%}
​</td>

​<td​ ​class​=​"order-number__cell">
​<span​ ​class​=​"order-number__text">
​Order​ ​{{​ order_name ​}}
​</span>
​</td>
​</tr>
​ /table>
<

​</td>
​ /tr>
<
​</table>

​ /center>
<
​</td>
​</tr>
</table>

​<table​ ​class​=​"row content">


​<tr>
​<td​ ​class​=​"content__cell">
​<center>
​<table​ ​class​=​"container">
​<tr>
​<td>

​<h2>​{{ email_title }}​</h2>


​<p>​{{ email_body }}​</p>
​{%​ ​if​ fulfillment​.​estimated_delivery_at ​%}
​<p>​{{ email_emphasis }}​</p>
​{%​ endif ​%}
​{%​ ​if​ order_status_url ​%}
​<table​ ​class​=​"row actions">
​<tr>
​<td​ ​class​=​"actions__cell">
​<table​ ​class​=​"button main-action-cell">
​<tr>
​<td​ ​class​=​"button__cell"​><a​ ​href​=​"{{ order_status_url }}"​ ​class​=​"button__text"​>​View
your order​</a></td>
​</tr>
​</table>
​{%​ ​if​ shop​.​url ​%}
​<table​ ​class​=​"link secondary-action-cell">
​<tr>
​<td​ ​class​=​"link__cell"​><a​ ​href​=​"{{ shop.url }}"​ ​class​=​"link__text"​><span
class​=​'or'​>​or​</span>​ Visit our store​</a></td>
​</tr>
​</table>
{%​ endif ​%}

​</td>
​ /tr>
<
</table>

​{%​ e ​ lse​ ​%}


​{%​ ​if​ shop​.​url ​%}
​<table​ ​class​=​"row actions">
​<tr>
​<td​ ​class​=​"actions__cell">
​<table​ ​class​=​"button main-action-cell">
​<tr>
​<td​ ​class​=​"button__cell"​><a​ ​href​=​"{{ shop.url }}"​ ​class​=​"button__text"​>​Visit our
store​</a></td>
​</tr>
​</table>
​</td>
​</tr>
​</table>
{%​ endif ​%}

​{%​ endif ​%}

​ /td>
<
​</tr>
​</table>
​</center>
​</td>
​</tr>
</table>

​<table​ ​class​=​"row section">


​<tr>
​<td​ ​class​=​"section__cell">
​<center>
​<table​ ​class​=​"container">
​<tr>
​<td>
​<h3>​Items in this shipment​</h3>
​ /td>
<
​</tr>
​</table>
​<table​ ​class​=​"container">
​<tr>
​<td>

<table​ ​class​=​"row">
​{%​ ​for​ line ​in​ fulfillment​.​fulfillment_line_items ​%}

​{%​ i ​ f​ item_count ​==​ ​1​ ​%}


​{%​ assign columnWrapperClass ​=​ ​'order-list__item--single'​ ​%}
​{%​ ​elsif​ forloop​.​first ​==​ ​true​ ​%}
​{%​ assign columnWrapperClass ​=​ ​'order-list__item--first'​ ​%}
​{%​ ​elsif​ forloop​.​last​ ​==​ ​true​ ​%}
​{%​ assign columnWrapperClass ​=​ ​'order-list__item--last'​ ​%}
​{%​ ​else​ ​%}
​{%​ assign columnWrapperClass ​=​ ​''​ ​%}
​{%​ endif ​%}
​<tr​ ​class​=​"order-list__item {{columnWrapperClass}}">
​<td​ ​class​=​"order-list__item__cell">
​<table>
​<td>
​{%​ ​if​ line​.​line_item​.​image ​%}
​<img​ ​src​=​"{{ line.line_item | img_url: 'compact_cropped' }}"​ ​align​=​"left"
width​=​"60"​ ​height​=​"60"​ ​class​=​"order-list__product-image"​/>
​{%​ endif ​%}
​</td>
​<td​ ​class​=​"order-list__product-description-cell">
​{%​ ​if​ line​.​line_item​.​product​.​title ​%}
​{%​ assign line_title ​=​ line​.​line_item​.​product​.​title ​%}
​{%​ ​else​ ​%}
​{%​ assign line_title ​=​ line​.​line_item​.​title ​%}
​{%​ endif ​%}
​<span​ ​class​=​"order-list__item-title"​>​{{ line_title }} × {{ line.line_item.quantity
}}​</span><br/>
​{%​ ​if​ line​.​line_item​.​variant​.​title ​!=​ ​'Default Title'​ ​%}
​<span​ ​class​=​"order-list__item-variant"​>​{{ line.line_item.variant.title }}​</span>
​{%​ endif ​%}
<br/>
{%​ ​if​ fulfillment​.​tracking_number ​%}
​{%​ ​if​ fulfillment​.​tracking_url ​%}
Tracking​ ​Number​:​ ​<​a href​=​"{{ fulfillment.tracking_url }}"​ alt​=​"Tracking url"​>{{
fulfillment​.​tracking_number ​}}</​a>
{%​ ​elsif​ fulfillment​.​tracking_number ​%}
Tracking​ ​Number​:​ ​{{​ fulfillment​.​tracking_number ​}}
{%​ endif ​%}
{%​ endif ​%}
​</td>
​ /table>
<
​</td>
​</tr>​{% endfor %}
</table>

​</td>
​ /tr>
<
​</table>
​</center>
​</td>
​</tr>
</table>

​<table​ ​class​=​"row footer">


​<tr>
​<td​ ​class​=​"footer__cell">
​<center>
​<table​ ​class​=​"container">
​<tr>
​<td>
​<p​ ​class​=​"disclaimer__subtext"​>​If you have any questions, reply to this email or
contact us at ​<a​ ​href​=​"mailto:{{ shop.email }}"​>​{{ shop.email }}​</a></p>
​</td>
​</tr>
​</table>
​</center>
​</td>
​</tr>
</table>

<img​ ​src​=​"{{ 'notifications/spacer.png' | shopify_asset_url }}"​ ​class​=​"spacer"​ ​height​=​"1"​ ​/>

​</td>
​ /tr>
<
​</table>
​</body>
</html>

You might also like