I’ve recently been getting a number of questions regarding Shopify email template, especially about adding a logo.
By default, Shopify email templates are in plain text. You can enable HTML template to add other fancier stuffs.
Go to Preferences » Email & Notifications. Click on the one you want to edit, such as “Order Confirmation”. On the bottom, you’ll see a checkbox for “Enable HTML template”.
Check that box and you’ll have another text box for HTML. You can basically copy/paste what you have in Plain Text box into this one and add other things.
Adding Logo
<a href="http://squaretheme.myshopify.com" >
<img src="{{'logo.png' | asset_url }}" alt="{{shop.name}}" />
</a>
Change http://squaretheme.myshopify.com to your shop. This should work if you are using Square theme, but if you are using Canvas theme or any other theme, the easiest way to find out the name of your logo is to look in y our Theme Settings:
What you see below the “Choose File” where you upload your logo is the file name of your logo. If it’s different than “logo.png”, make that change to the above code.
Whole Example: Order Confirmation
<a href="http://squaretheme.myshopify.com" title="Go Home" id="logo"> <img src="{{'logo.png' | asset_url }}" alt="{{shop.name}}" /> </a> <p>Thank you for placing your order with {{ shop_name }}!</p> <p>This email is to confirm your recent order.</p> <p>Date {{ date | date: "%m/%d/%Y" }}{% if requires_shipping %}</p> <h4>Shipping address</h4> <p>{{ shipping_address.name }} <br /> {{ shipping_address.street }}<br /> {{ shipping_address.city }}, {{ shipping_address.province }} {{ shipping_address.zip }}<br /> {{ shipping_address.country }}{% endif %} </p> <h4>Billing address</h4> <p>{{ billing_address.name }}<br /> {{ billing_address.street }}<br /> {{ billing_address.city }}, {{ billing_address.province }} {{ billing_address.zip }}<br /> {{ billing_address.country }} </p> <ul>{% for line in line_items %}<li>{{ line.quantity }}x <strong>{{line.title }}</strong> for {{ line.price | money }} each</li> {% endfor %} </ul> <p><strong>Special Instructions:</strong> {{ note }}</p> <p>{% if discounts %}<strong>Discounts:</strong> {{ discounts_savings | money_with_currency }}{% endif %}<br /> <strong>Subtotal:</strong> {{ subtotal_price | money_with_currency }}{% for tax_line in tax_lines %}<br /> <strong>{{ tax_line.title }}:</strong> {{ tax_line.price | money_with_currency }}{% endfor %}{% if requires_shipping %}<br /> <strong>Shipping:</strong> {{ shipping_price | money_with_currency }}{% endif %}<br /> <strong>Total:</strong> {{ total_price | money_with_currency }}</p>Note: I added the line for Special Instructions that should be included for Canvas & Square themes. If your theme does not have that feature on the cart page, you should delete that. Other lines should work fine.
<p><strong>Special Instructions:</strong> {{ note }}</p>