Hi all,
At the Moment the client id appears within the clients address (client section), but I’d like to move it to the invoice section, direct beneath the invoice number. But when I go to Settings → invoice design → invoice (section): the client id is not listed in the dropdown, so I can not add it here.
Any ideas how to bring the client id to the invoice section?
Greetings
hillel
December 17, 2024, 9:00am
2
Hi,
It should be possible using a custom design.
I try to create a custom design. I used the “Business” design as a basis.
hillel
December 17, 2024, 10:11am
4
The designs use the field stacks to show the fields selected in the UI. You can use the HTML version of the design to copy the code for the stacks and then modify them to suit your needs in your custom design.
The invoice data seem to be within a table “entity-details”. And it seems important to use this table (and to add the customer id to this table), so that the table - look persist. in the HTML only this table is called.
How can I add the customer id to the entity-details - table?
hillel
December 17, 2024, 11:34am
6
You’d need to replace the entity-details section with the variables you want to show
Ah ok, I see. So I have to build my own table there.
To make use of the label “Rechnungsnummer”: what do I have to choose? “$invoice_number” did not work. ;o(
Can I see somewhere the html-code for the entity-details - table?
hillel
December 17, 2024, 12:11pm
8
Try $invoice.number
If you use the desktop app when you enable HTML mode you’ll also see the raw HTML
$invoice.number displays the invoice number itself. But I’d like to display the word “Rechnungsnummer” and later on “Kundennummer” (customer id)
ITSAW
December 17, 2024, 12:21pm
10
Look like my Design:
<table id="entity-details" cellspacing="0" dir="$dir">
<tr><td>Kundennummer</td><td>$client.number</td></tr>
</table>
Looks like
Its pure HTML for the Design of any entity
1 Like
Yes, that’s also my solution for now. But it seems not very clean.
If it’s not possible to use a variable for “Kundennummer” I will choose this solution.
Thanks anyway
ITSAW
December 17, 2024, 12:48pm
12
You mean the labeling of the field?
Here is my template according to DIN5008:
<div id="body">
<div class="company-logo-wrapper">
<img class="company-logo" src="$company.logo" alt="$company.name logo">
<div style="float:right;">
<div id="company-address"></div>
<p> </p>
<p>Telefon: $company.phone</p>
<p> </p>
<p>E-Mail: $company.email</p>
<p>$company.website</p>
</div>
</div>
<div class="client-entity-wrapper">
<div class="wrapper-left-side">
<div class="text-with-client">
<div id="vermerkzone">$company.name - $company.address1 - $company.postal_code $company.city</div>
<div id="anschriftzone">
<div id="client-details"></div>
<!--
<p>$client.name</p>
<p>$contact.full_name</p>
<p>$address1</p>
<p>$postal_city_state</p>
-->
</div>
</div>
</div>
<div class="wrapper-right-side">
<table id="entity-details" cellspacing="0" dir="$dir">
<tr><td>Kundennummer</td><td>$client.number</td></tr>
</table>
<div class="sepa_qr">$sepa_qr_code</div>
</div>
</div>
</div>
<p class="entity-label">$entity_label</p>
<table id="product-table" cellspacing="0" data-ref="table"></table>
<table id="task-table" cellspacing="0" data-ref="table"></table>
<table id="delivery-note-table" cellspacing="0" data-ref="table"></table>
<table id="statement-invoice-table" cellspacing="0" data-ref="table"></table>
<div id="statement-invoice-table-totals" data-ref="statement-totals"></div>
<table id="statement-payment-table" cellspacing="0" data-ref="table"></table>
<div id="statement-payment-table-totals" data-ref="statement-totals"></div>
<table id="statement-aging-table" cellspacing="0" data-ref="table"></table>
<div id="statement-aging-table-totals" data-ref="statement-totals"></div>
<div id="table-totals" cellspacing="0"></div>
<div class="entity-footer" data-ref="total_table-footer">$entity_footer</div>
<div class="repeating-footer-space"> </div>
</div>
Header:
<div class="repeating-header" id="header"></div>
Footer:
<div class="repeating-footer" id="footer">
<p>Bankverbindung: $company.custom3</p>
<p>IBAN $company.custom1 · BIC $company.custom2</p>
<p>USt-Id: $company.vat_number</p>
<script>
// Clear up space a bit, if [product-table, tasks-table, delivery-note-table] isn't present.
document.addEventListener('DOMContentLoaded', () => {
let tables = [
'product-table', 'task-table', 'delivery-note-table',
'statement-invoice-table', 'statement-payment-table', 'statement-aging-table-totals',
'statement-invoice-table-totals', 'statement-payment-table-totals', 'statement-aging-table',
'client-details','vendor-details'
];
tables.forEach((tableIdentifier) => {
console.log(document.getElementById(tableIdentifier));
document.getElementById(tableIdentifier)?.childElementCount === 0
? document.getElementById(tableIdentifier).style.setProperty('display', 'none', 'important')
: '';
});
});
// Hide duplicate customer/contact name
document.addEventListener('DOMContentLoaded', () => {
document.querySelector('[data-ref="client_details-client.name"]').innerText == document.querySelector('[data-ref="client_details-contact.full_name"]').innerText
? document.querySelector('p[data-ref="client_details-contact.full_name"]').remove()
: '';
});
</script>
</div>
As you can see, most of the variables are used, but the labels were entered manually.@hillel has a tip
Ok, I understand.
Thanks a lot …
