You can design your own HTML text or copy the below HTML Templates to customise your invoice layout.
Design your own HTML Layout
To design your own invoice layout please select shipping-> Invoice & Shipping Labels-> Invoice template link (you need to set the invoice template per channel)
You will start with a default template pre set as pictured below.
To customise your template please select View -> Source Code-> You can enter your HTML design here.
To add an image into your invoice template please view the user guide below.
Please select 'help' tab to view the available tags you can use in your invoice.
Please select settings to add tax amount to your invoice template and customise your line item headers.
HTML Templates
To copy one of the available HTML designs please follow the steps outlined below.
Please copy the below HTML text and paste under Shipping-> Invoice & Shipping labels -> Invoice template link (you can set the invoice template per channel) -> View-> Source Code-> Paste the HTML text here.
HTML Template 1
<div><header>
<h1>Enter your invoice header here </h1>
</header></div>
<div></div>
<div><br />
<table width="862" height="360">
<tbody>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${shippingname!}</span></td>
<td>Enter your address Here </td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${address_line1!}</span></td>
<td></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${address_line2!}</span></td>
<td></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${city!}</span><span style="color: #333333; font-family: 'Open Sans', sans-serif; font-weight: bold;"></span></td>
<td></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${postcode!}</span></td>
<td></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${country!}</span></td>
<td></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;"><span style="box-sizing: border-box;">${order_id!}</span></span></td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;">Invoice No:</td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;"><span style="color: #333333; font-family: 'Open Sans', sans-serif; font-weight: bold;">${invoice_no!}</span></td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;">Order Date:</td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;"><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${order_date!}</span></td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;">Order ID:</td>
</tr>
<tr>
<td></td>
<td style="outline: thin solid;"><span style="color: #333333; font-family: 'Open Sans', sans-serif; font-weight: bold;">${order_id!}</span></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${phonenumber!}</span></td>
</tr>
<tr>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${buyer_email!}</span></td>
</tr>
</tbody>
</table>
</div>
HTML Template 2
<div><header><img src="enter your Image URL here" gt="" div="" style="float: right;" />
<h1>Type your invoice header here</h1>
</header></div>
<div>
<table width="1111" height="144">
<tbody>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>company name</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${shippingname!}</span></td>
</tr>
<tr>
<td>company address line 1</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${address_line1!}</span></td>
</tr>
<tr>
<td>company address line 2</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${address_line2!}</span></td>
</tr>
<tr>
<td>company address line 3</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${address_line3!}</span></td>
</tr>
<tr>
<td>company address line 4</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${city!}</span></td>
</tr>
<tr>
<td>company post code</td>
<td><span style="box-sizing: border-box; font-weight: bold; color: #333333; font-family: 'Open Sans', sans-serif;">${postcode!}</span></td>
</tr>
</tbody>
</table>
</div>
<div>
<table width="1234" height="195">
<tbody>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td>Invoice number:</td>
<td>${invoice_no!}</td>
</tr>
<tr>
<td>Invoice date:</td>
<td>${order_date!}</td>
</tr>
<tr>
<td>customer phone number</td>
<td>${phonenumber!}</td>
</tr>
<tr>
<td>customer email</td>
<td>${buyer_email!}</td>
</tr>
</tbody>
</table>
</div>