Log in to your Shopify admin panel and follow these steps:
Step 1: Access Confirmation Email Template #
- Navigate to Settings > Notifications > Customer Notifications.
- Locate and select Order confirmation
- Click on the Edit code button to access the email template’s HTML code.
Step 2: Add custom code to email template #
2.1. Place your cursor in the Email body (HTML), use the shortcut Ctrl + F (Command + F on Mac) to open the search function.
Search for “line.unit_price_measurement” in the existing code.
After locating “</table>”, paste the following code snippet:
<table>
<tr>
<td class="order-list__image-cell">
<div class="order-list__no-image-cell small" style="border: none; width: 60px; height: 60px;">
</div>
</td>
<td class="order-list__product-description-cell">
{%- for attribute in attributes -%}
{%- assign attribute_key = attribute.first -%}
{%- assign attribute_value = attribute.last -%}
{%- if attribute_key contains 'sbb_' -%}
{%- assign box_id = attribute_key | remove: 'sbb_' -%}
{%- assign formatted_value = attribute_value | strip -%}
<div>
<pre style="margin:0; font-family: inherit;">{{ formatted_value }}</pre>
</div>
{%- endif -%}
{%- endfor -%}
</td>
</tr>
</table>
2.2. Place your cursor in the Email body (HTML), use the shortcut Ctrl + F (Command + F on Mac) to open the search function.
Search for “ row subtotal-lines” in the existing code.
After locating “{% endif %}”, paste the following code snippet:
{%- assign line_items_json = line_items | json -%}
{%- if line_items_json contains '_sbb:itemQty' -%}
<table>
<tr>
<td class="order-list__image-cell">
<div class="order-list__no-image-cell small" style="border: none; width: 60px; height: 60px;">
</div>
</td>
<td class="order-list__product-description-cell">
{%- for attribute in attributes -%}
{%- assign attribute_key = attribute.first -%}
{%- assign attribute_value = attribute.last -%}
{%- if attribute_key contains 'sbb_' -%}
{%- assign box_id = attribute_key | remove: 'sbb_' -%}
{%- assign formatted_value = attribute_value | strip -%}
<div>
<pre style="margin:0; font-family: inherit;">{{ formatted_value }}</pre>
</div>
{%- endif -%}
{%- endfor -%}
</td>
</tr>
</table>
{%- endif -%}
Step 3 : Save changes #
Click on the “Save” button to apply the changes to the template.
Wait for approximately 30 seconds for the changes to take effect.
Need Assistance? #
If you run into any challenges while adding Easify’s custom options to your Order Confirmation Emails, feel free to reach out to us for assistance through our convenient in-app live chat, by submitting your request via our contact form, or by sending an email to support@tigren.com. We’re here to help!
