Skip to main content
Custom Invoice Template

Why not cut to the chase, and just send them a bill?!

Kenzie avatar
Written by Kenzie
Updated over 7 years ago

This is a great template to use when you have a customer on the phone, and they committed to buy, but you want them to place the order online. (Make sure to change your subjet line to say "Invoice" in the draft quote view before sending.)

Before pasting this code into your template, be sure you're in code view in the template editor: 

Code for Basic Invoice Template

<table width="100%" cellpadding="0" cellspacing="0" style="border: 1px solid #e9e9e9; background-color: #fff; border-radius: 3px;" bgcolor="#fff">     <tbody>         <tr>             <td style="padding: 10px;">                 <table cellpadding="0" cellspacing="0">                     <tbody>                         <tr>                             <td style="vertical-align: top; text-align: center;" align="center" valign="top"> <img src="{{=qn.store.logo.url}}" style="max-width: 100%; float: left;"><div style="text-align: right;"><span style="background-color: transparent;"><b>&nbsp;Invoice #{{=qn.quote.quote_id}}</b><br>{{=qn.date}}</span></div></td>                         </tr>                         <tr>                             <td style="vertical-align: top;" valign="top">                                 <h3 style="font-family: &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Lucida Grande&quot;, sans-serif; color: rgb(0, 0, 0); line-height: 1.2; margin: 20px 0px 5px; font-size: 16px !important;">{{=qn.customer.company}}<br></h3>                         </td></tr>                                                <tr>                             <td style="vertical-align: top;" valign="top">                                 <table style="text-align: left; width: 100% !important; margin: 5px auto;">                                     <tbody>                                         <tr>                                             <td style="vertical-align: top; padding: 5px 0px 20px 0px;" valign="top">                                                 <table style="width: 100%;">                                                     <tbody>                                                         <tr>                                                             <td style="vertical-align: top; width: 50%; padding: 5px 0;" valign="top">                                                                 {{=qn.customer.name}}<br>                                                                 {{=qn.customer.address}}<br>                                                                 {{=qn.customer.city}},&nbsp;{{=qn.customer.state}}&nbsp;{{=qn.customer.zipcode}}<br>                                                               </td>                                                             <td style="vertical-align: top; width: 50%; padding: 5px 0;" valign="top">                                                               Notes:&nbsp;{{=qn.quote.notes}}                                                             </td>                                                         </tr>                                                     </tbody>                                                 </table>                                             </td>                                         </tr>                                         <tr>                                          </tr></tbody></table>                                            {{=qn.product_table}}                                          <table width="100%" cellpadding="0" cellspacing="0">                                          <tbody></tbody>                                          </table>                                         </td></tr>                                         <tr>                                             <td style="vertical-align: top; text-align: right; padding: 5px 0;" align="right" valign="top"> <a href="{{=qn.store.cart}}?quoteId={{=qn.quote.id}}" style="color: #fff; text-decoration: none; line-height: 2; font-weight: bold; text-align: center; cursor: pointer; display: inline-block; border-radius: 5px; text-transform: capitalize; background-color: #1ab394; border-color: #1ab394; border-style: solid; border-width: 5px 10px;">Pay Online</a></td>                                         </tr>                                         <tr>                                             <td style="vertical-align: top; padding: 5px 0;" valign="top">                                                 <h3 style="font-family: 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; color: #000; line-height: 1.2; font-weight: 600 !important; font-size: 16px !important; margin: 20px 0 5px;">Questions?</h3><ul style="margin-bottom: 10px; font-weight: normal;">                                                     <li style="margin-left: 5px; list-style-position: inside;">Contact us at <a href="mailto:{{=qn.store.email}}">{{=qn.store.email}}</a> or call us at <a href="tel:{{=qn.store.phone}}">{{=qn.store.phone}}</a>.</li>                                                 </ul>                                             </td>                                         </tr>                                     </tbody>                                 </table>                             </td>                         </tr>                     </tbody>                 </table>
Did this answer your question?