Default Payment Template - 4(Document)Header <style type="text/css">.paymenttable th, .paymenttable td { padding: 5px font-size: 14px } </style> <table align="center" border="0" cellpadding="0" cellspacing="0" class="paymenttable" style="width:100%"> <tbody class="header"> <tr style="background-color:#00bfa5"> <td colspan="2" style="height:80px; width:482px"></td> <td style="height:80px; width:210px"></td> <td style="height:80px; width:58px"></td> </tr> <tr style="background-color:#00bfa5"> <td colspan="2" style="height:20px; width:482px"></td> <td colspan="1" rowspan="2" style="background-color:#ffffff; height:20px; overflow:visible; width:210px"><img alt="" src="{{ templatesettings.logoLocation }}" /></td> <td style="height:20px; width:58px"></td> </tr> <tr> <td rowspan="2" style="width:29px"></td> <td rowspan="2" style="width:501px"><span style="font-size:32px"><strong>PAYMENT RECEIPT</strong> </span><br /> <span style="font-size:24px">#{{ payment.number }}</span> <table style="margin-top:1rem; width:100%"> <tbody> <tr> <td style="padding-bottom:1px; padding-top:1px"><strong>Receipt date:</strong></td> <td style="padding-bottom:1px; padding-top:1px"><strong>Receipt number:</strong></td> <td style="padding-bottom:1px; padding-top:1px"><strong>Customer number:</strong></td> </tr> <tr> <td style="padding-bottom:1px; padding-top:1px">{{ payment.date|dateformat }}</td> <td style="padding-bottom:1px; padding-top:1px">#{{ payment.number }}</td> <td style="padding-bottom:1px; padding-top:1px">{{ payment.clientContact.code }}</td> </tr> </tbody> </table> </td> <td style="width:58px"></td> </tr> <tr> <td style="width:210px"></td> <td style="width:58px"></td> </tr> </tbody> </table> <div style="margin:-8px 20px 0px 20px;"> <table style="margin-bottom:1rem; margin-left:5px; width:100%"> <tbody> <tr> <td style="padding-bottom:1px; padding-top:1px"><strong>Payment amount:</strong></td> <td style="padding-bottom:1px; padding-top:1px"><strong>Payment method:</strong></td> <td style="padding-bottom:1px; padding-top:1px"><strong>Account balance:</strong></td> </tr> <tr> <td style="padding-bottom:1px; padding-top:1px">{{ payment.amount|moneyformat }} </td> <td style="padding-bottom:1px; padding-top:1px">{{ payment.paymentMethod }} </td> <td style="padding-bottom:1px; padding-top:1px">{{ payment.clientContact.balanceAt|moneyformat }}</td> </tr> </tbody> </table> </div> Body <style type="text/css">body{ font-family: sans-serif; } table { border-collapse: collapse; } .header-table tr,td, th { padding: 8px 2px; line-height:1.5; } .data-table td,th { border-bottom: 1px solid #cfd8dc; border-collapse: collapse; padding: 8px 2px; } .footer-table tr,td{ padding:2px 4px; } .data-table td.subline { color: #555555; font-style: italic; } </style> <div class="content" style="padding: 1rem 8px 0 8px;">{% if financialsettings.showInvoiceItemOnPaymentReceipt %}{% for financialAllocation in financialAllocations %}{% if financialAllocation.invoice %}{% set invoice = financialAllocation.invoice %} <table style="line-height:1; width:100%"> <tbody> <tr> <td><strong>Date:</strong> {{ financialAllocation.date|dateformat }}</td> <td><strong>Record paid:</strong> {{ invoice.number }}</td> </tr> </tbody> </table> <table class="data-table" style="width:100%"> <tbody> <tr> <th style="width:80%; text-align: left;">Description</th> <th style="text-align: left;">Qty</th> <th style="text-align: right;">Total</th> </tr> {% for invoiceexpense in invoice.lineItems %}{% if invoiceexpense.isHeaderLine and not invoiceexpense.hasHeaderLine %} <tr> <td>{{ invoiceexpense.productName }}</td> <td>{{ invoiceexpense.qty }}</td> <td style="text-align:right">{{ invoiceexpense.total(true)|moneyformat }}</td> </tr> {% if invoiceexpense.printContained %}{% for subline in invoiceexpense.nestedLines %} <tr> <td class="subline" style="padding-left: 8px;">{{ subline.productName }}</td> <td class="subline">{{ subline.qty }}</td> <td class="subline" style="text-align:right">{% if invoiceexpense.printContainedPrices %}{{ (subline.total(true))|moneyformat }} {% endif %}</td> </tr> {% if subline.isHeaderLine %}{% if subline.PrintContained %}{% for sub2line in subline.nestedLines %} <tr> <td class="subline" style="padding-left: 12px;">{{ sub2line.productName }}</td> <td class="subline">{{ sub2line.qty }}</td> <td class="subline" style="text-align:right">{% if subline.printContainedPrices %}{{ (sub2line.total(true))|moneyformat }} {% endif %}</td> </tr> {% if sub2line.isHeaderLine %}{% if sub2line.PrintContained %}{% for sub3line in sub2line.nestedLines %} <tr> <td class="subline" style="padding-left: 16px;">{{ sub3line.productName }}</td> <td class="subline">{{ sub3line.qty }}</td> <td class="subline" style="text-align:right">{% if sub2line.printContainedPrices %}{{ (sub3line.total(true))|moneyformat }} {% endif %}</td> </tr> {% endfor %}{% endif %}{% endif %} {% endfor %}{% endif %}{% endif %} {% endfor %}{% endif %}{% elseif not invoiceexpense.hasHeaderLine %} <tr> <td>{{ invoiceexpense.productName }}</td> <td>{{ invoiceexpense.qty }}</td> <td style="text-align:right">{{ invoiceexpense.total(true)|moneyformat }}</td> </tr> {% endif %}{% endfor %} </tbody> </table> <table style="text-align:right; width:100%"> <tbody> <tr> <td>Total: <strong>{{ financialAllocation.amount|moneyformat }}</strong></td> </tr> <tr> <td>Paid: <strong>{{ financialAllocation.allocatedamount|moneyformat }}</strong></td> </tr> </tbody> </table> {% endif %}{% endfor %} {% else %} <table class="data-table" style="width:100%; padding-bottom:1rem; line-height:2;"> <tbody> <tr style="padding-bottom:1rem;"> <th style="text-align: left; padding: 4px;">Date</th> <th style="text-align: left; padding: 4px;">Record Paid</th> <th style="text-align: left; padding: 4px;">Total</th> <th style="text-align: left; padding: 4px;">Paid</th> </tr> {% for financialAllocation in financialAllocations %} <tr> <td style="text-align: left; padding: 4px; width: 30%;">{{ financialAllocation.date|dateformat }}</td> <td style="text-align: left; padding: 4px; width: 30%;">{{ financialAllocation.invoice.number }}</td> <td style="text-align: left; padding: 4px; width: 25%;">{{ financialAllocation.amount|moneyformat }}</td> <td style="text-align: left; padding: 4px; width: 15%;">{{ financialAllocation.allocatedamount|moneyformat }}</td> </tr> {% endfor %} </tbody> </table> {% endif %} </div> {% if payment.comments is not empty %} <div style="margin-top:4rem; padding-left: 12px;"> <div><strong>Payment Comments</strong></div> <div>{{ payment.comments }}</div> </div> {% endif %} Footer <style type="text/css">hr { height: 2px; border-width: 0; color: #fff; background-color: #fff; } .footerAddressContainer tr td { padding-right: 35px; font-size: 14px; } </style> <div style="background-color: #00BFA5; color:#fff; padding: 20px 40px 60px 20px;"> <table align="center" border="0" cellpadding="1" cellspacing="1" style="color:#ffffff; width:720px"> <tbody> <tr> <td style="color:#ffffff; width:180px"><strong><span style="font-size:28px">THANK YOU</span> </strong></td> <td style="width:524px"> <hr /></td> </tr> </tbody> </table> <table align="center" border="0" cellpadding="2" cellspacing="2" style="width:720px"> <tbody class="footerAddressContainer"> <tr> <td style="color:#ffffff">Address:<br /> <strong>{{ business.postalAddress.addressText(false, true) }}</strong></td> <td style="color:#ffffff">Phone:<br /> <strong>{{ business.phoneNumber }}</strong></td> <td style="color:#ffffff">Email:<br /> {{ business.businessEmail }}</td> </tr> </tbody> </table> </div> Parent topic: Source code of standard Twig templatesRelated conceptsDefault Estimate Template - 1(Document)Default Estimate Template - 2(Document)Default Estimate Template - 3(Document)Default Estimate Template - 4(Document)Default Estimate Template - 5(Document)Default Estimate Template - 6(Document)Default Invoice Template - 1(Document)Default Invoice Template - 2(Document)Default Invoice Template - 3(Document)Default Invoice Template - 4(Document)Default Invoice Template - 5(Document)Default Invoice Template - 6(Document)Default Payment Template - 1(Document)Default Payment Template - 2(Document)Default Payment Template - 3(Document)Default Payment Template - 5(Document)Default Statement Template - 1(Document)Default Statement Template - 2(Document)Default Statement Template - 3(Document)