Draft order invoice
Please, press Ctrl+C (Cmd+C) to copy the code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- General page information --> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Draft order invoice</title> <!-- Mobile Specific Meta --> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Google Fonts --> <link href='https://fonts.googleapis.com/css?family=Raleway:400,700|Bitter' rel='stylesheet' type='text/css'> <!-- Custom Style --> <style type="text/css"> [style*="Raleway"] { font-family: Raleway, Tahoma, Geneva, sans-serif !important; } [style*="Bitter"] { font-family: Bitter, 'Palatino Linotype', 'Book Antiqua', Palatino, serif !important; } </style> </head> <body style="margin:0; padding:0;"> <table width="100%" height="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;" bgcolor="#f5f4f4"> <tr> <td> <table width="520" cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <!-- Top space --> <tr> <td valign="top" align="center" height="80" style="font-size:1px;"></td> </tr> <!-- end top space --> <!-- Header --> <tr> <td valign="top" align="center" bgcolor="#ffffff" style="font-size:1px;"> <table width="460" cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" style="font-size:1px;"> <!-- Point --> <table cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" height="38" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" height="4" width="4" style="font-size:4px; border-radius: 50%; background-color: #5c4b51;"> </td> </tr> <tr> <td valign="top" align="center" height="37" style="font-size:1px;"></td> </tr> </table> <!-- End Point --> <!-- Greatting message --> <table cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" style="font-family: Bitter, 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size:24px; color: #5c4b51; line-height: 30px;"> Invoice {{ name }} from {{ shop.name | capitalize }} </td> </tr> <tr> <td valign="top" align="center" height="13" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; color: #5c4b51; letter-spacing: 3px"> January 4, 2016 </td> </tr> <tr> <td valign="top" align="center" height="13" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; color: #5c4b51;"> To purchase your order, follow this secure payment link: </td> </tr> <tr> <td valign="top" align="center" height="20" style="font-size:1px;"></td> </tr> <tr> <td width="400" valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; font-weight: bold; line-height: 30px; word-break:break-all; text-align: center;"> <font style="word-break:break-all;"><a href="{{ invoice_url }}" style="text-decoration: none; color: #f06060; word-break:break-all;">{{ invoice_url }}</a></font> </td> </tr> <tr> <td valign="top" align="center" height="30" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; color: #5c4b51;"> {% if reserve_inventory_until %}{% if item_count > 1 %}These items{% else %}This item{% endif %} will be reserved for you{% endif %} </td> </tr> <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; color: #5c4b51;"> {% if reserve_inventory_until %}until <strong>{{ reserve_inventory_until | date: "%B %-d, %Y at %I:%M %p %Z" }}</strong>.{% endif %} </td> </tr> </table> <!-- End Greatting message --> </td> </tr> </table> </td> </tr> <!-- End header --> <!-- Order table --> <tr> <td valign="top" align="center" bgcolor="#ffffff" style="font-size:1px;"> <table width="460" cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" height="29" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" height="38" width="460" style="font-size:1px; border-top: solid 3px #f5f4f4;" bgcolor="#ffffff"></td> </tr> <tr> <td valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; text-align: left; line-height: 30px; color: #5c4b51; letter-spacing: 3px; padding-left: 30px;"> Invoice summary </td> </tr> {% for line in line_items %} <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; font-weight: bold; text-align: left; color: #5c4b51; border-bottom: solid 1px #f5f4f4; padding: 10px 0px 10px 30px;"> {{ line.quantity }}x {{ line.title }} for {{ line.price | money_with_currency }} {% if line.applied_discounts.size > 0 %}(regularly {{ line.original_price | money_with_currency }}) {% endif %}each </td> </tr> {% endfor %} <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; border-bottom: solid 1px #f5f4f4; padding: 10px 0px 10px 30px;"> Subtotal: {{ subtotal_price | money_with_currency }}{% if discounts %} </td> </tr> <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; border-bottom: solid 1px #f5f4f4; padding: 10px 0px 10px 30px;"> Discount{% if discounts.first.code %} ({{ discounts.first.code }}){% endif %}: - {{ discounts_amount | money_with_currency }}{% endif %}{% for tax_line in tax_lines %} </td> </tr> <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; border-bottom: solid 1px #f5f4f4; padding: 10px 0px 10px 30px;"> {{ tax_line.title }}: {{ tax_line.price | money_with_currency }}{% endfor %}{% if requires_shipping %} </td> </tr> <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding: 10px 0px 10px 30px;"> {% if shipping_method %}Shipping: {{ shipping_price | money_with_currency }}{% else %}Shipping available upon checkout.{% endif %}{% endif %} </td> </tr> <tr> <td valign="top" align="center" height="29" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" height="35" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; font-weight: bold; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 30px;"> Amount due: {{ total_price | money_with_currency }} </td> </tr> <tr> <td valign="top" align="center" height="25" style="font-size:1px;"></td> </tr> {% if requires_shipping and shipping_address %} <tr> <td valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; text-align: left; line-height: 30px; color: #5c4b51; letter-spacing: 3px; padding-left: 30px;"> Shipping address: </td> </tr> <tr> <td valign="top" align="center" height="19" style="font-size:1px;"></td> </tr> {% if shipping_address.name %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ shipping_address.name }} </td> </tr> {% endif %} {% if shipping_address.street %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ shipping_address.street }} </td> </tr> {% endif %} {% if shipping_address.province or shipping_address.zip or shipping_address.city %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ shipping_address.province }}, {{ shipping_address.city }} {{ shipping_address.zip }} </td> </tr> {% endif %} {% if shipping_address.country %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ shipping_address.country }} </td> </tr> {% endif %} <tr> <td valign="top" align="center" height="29" style="font-size:1px;"></td> </tr> {% endif %} {% if billing_address %} <tr> <td valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; text-align: left; line-height: 30px; color: #5c4b51; letter-spacing: 3px; padding-left: 30px;"> Billing address </td> </tr> <tr> <td valign="top" align="center" height="19" style="font-size:1px;"></td> </tr> {% if billing_address.name %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ billing_address.name }} </td> </tr> {% endif %} {% if billing_address.street %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ billing_address.street }} </td> </tr> {% endif %} {% if billing_address.city or billing_address.province or billing_address.zip %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ billing_address.province }}, {{ billing_address.city }} {{ billing_address.zip }} </td> </tr> {% endif %} {% if billing_address.country %} <tr> <td valign="top" align="center" style="font-size:16px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; text-align: left; color: #5c4b51; padding-left: 50px;"> {{ billing_address.country }} </td> </tr> {% endif %} {% endif %} <tr> <td valign="top" align="center" height="35" width="460" style="font-size:1px; border-bottom: solid 3px #f5f4f4;" bgcolor="#ffffff"></td> </tr> <tr> <td valign="top" align="center" height="29" style="font-size:1px;"></td> </tr> </table> </td> </tr> <!-- End Order table --> <!-- Footer --> <tr> <td valign="top" align="center" bgcolor="#ffffff" style="font-size:1px;"> <table width="460" cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" style="font-size:1px;"> <!-- Thank you section --> <table width="400" cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" height="10" style="font-size:11px;"></td> </tr> <tr> <td valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 30px; color: #ada2a4;"> Thanks for shopping! </td> </tr> <tr> <td width="400" valign="top" align="center" style="font-size:14px; font-family: Raleway, Tahoma, Geneva, sans-serif; line-height: 10px; color: #ada2a4;"> {{ shop.name | capitalize }} </td> </tr> <tr> <td valign="top" align="center" height="15" style="font-size:11px;"></td> </tr> </table> <!-- End Thank you section --> <!-- Point --> <table cellpadding="0" cellspacing="0" align="center" border="0" style="border-collapse:collapse;"> <tr> <td valign="top" align="center" height="23" style="font-size:1px;"></td> </tr> <tr> <td valign="top" align="center" height="4" width="4" style="font-size:4px; border-radius: 50%; background-color: #5c4b51;"> </td> </tr> <tr> <td valign="top" align="center" height="37" style="font-size:1px;"></td> </tr> </table> <!-- End Point --> </td> </tr> </table> <!-- End 540px table --> </td> </tr> <!-- End Footer --> <!-- Bottom space --> <tr> <td valign="top" align="center" height="80" style="font-size:1px;"></td> </tr> <!-- end Bottom space --> </table> <!-- End content table --> </td> </tr> </table> <!-- End main wrapper table --> </body> </html>