We are trying to create a custom invoice template similar to our current layout prior to using QuickFile. This involves adding an .HTML table at the bottom of the invoice below the Payment Terms to include Payment Remittance Information and Company Bank Details in a nicely formatted layout.
We have created a custom template and added a header for Remittance Details in the footer, plus a HTML table below, however the .HTML table is appearing at the bottom of the page with a huge gap between itself and the Remittance Details Header.
Can you please confirm how we can add our Bank Details on the Invoice Template, including IBAN details, or do you have additional templates already designed to accomodate this information.
I would also like to know how we can get into the .HTML layout for a custom invoice template as we can only seem to modify the .CSS information relating to the template.
With the terms, the HTML can be added into the payment terms box on the invoice. You can set a default version by going to Account Settings >> Invoice Customisation which will then set it by default (but you can still edit it from invoice to invoice).
We support a number of different HTML tags - a full list can be found here: Rich Content Support
You can add HTML using these boxes if you wish and if you add IDs or classes, you can then customise this through the CSS customiser.
We have done this as you have suggested by creating a new custom invoice template and have changed the colour scheme in the .CSS record to suit what we require. However in our old accounts system our invoice layout included a nicely formatted section below the invoice payment terms that has a box with our company bank details and any IBAN and BIC information for overseas payments to us. The text in this box is nicely aligned and formatted, so we would like to replicate this in either the Payment Terms section or Footer Section of this custom template in QuickFile.
The issue we are having is with the .HTML table, as it appears as required but the .HTML code or .CSS is forcing a huge gap between the body of the invoice further up the page and the footer area where we have placed the .HTML code for this table. If we just place text in the Footer it appears fine.
We would very much appreciate your assistance on this to fix the issue.
One thing to check is if you have new lines in your code (any where in the code). The new lines are kept so this could be inadvertently causing everything to be pushed down slightly.
I have checked the .html code for the table and nothing seems astray. Please see below skeleton code of the .html table we are inserting into the footer on the custom template.
As you can see it all looks ok and there is nothing fancy in it. However when we insert this table structure it appears in testing on screen many lines down the page from the payment terms and the summary balance box on the invoice.
I keep meaning to add this as a bug as this is exactly what is happening here (and somewhere else that I can’t find the post to for some reason, maybe you made that private at some point?).
@Glenn has suggested using Markdown instead, which if that is better supported might be worth a try.