Customizing Invoice PDF Templates

You can change how your PDF invoices look. You edit the invoice PDF template with HTML and Twig code: variables, filters, and blocks. Each brand has its own template.

Open the Invoice PDF Template page

1. Select the brand that you want to customize. Use the brand selector at the top left of the page.
2. Click Settings.
3. In the Templates section, click Invoice PDF Template. The Invoice PDF Template page opens.

Edit the template

1. Change the HTML code of the template in the editor. See Editing tips.
2. Click Preview PDF to see the result. The preview uses sample data. Custom service modules and plugins do not show in the preview, but they show on real invoices.
3. Click Save Changes. Ubersmith checks the template. If the template has an error, Ubersmith shows the error and does not save it.

Turn on the template

The template does not apply to invoices until you turn it on.

1. In the Apply Template to Invoice PDF Generation field, select YES to use the template for PDF invoices.
2. Optional: In the Apply Template to Printable Text Version of Invoice field, select YES to also use the template when an invoice is viewed in the browser.
3. Click Save Changes.

Editing tips

The template uses HTML and the Twig template language. Your HTML must be valid.

• Autocomplete: press Ctrl+Space in the editor. In HTML, the list shows HTML tags. After {{ or {%, the list shows variables, filters, and blocks.
• Variables: values from the invoice, the client, and your settings. Type a variable in double braces, for example {{ invoice.date }} or {{ client.company }}. The groups are settings, labels, invoice, client, and client.metadata for custom client fields.
• Filters: functions that change how a variable shows. Type | and the filter after the variable, for example {{ invoice.date | date }} or {{ invoice.total_tax | currency }}. The filters are date, number, currency, and currency(symbol).
• Blocks: the main sections of the invoice, for example {{ block('service_items') }} or {{ block('bill_to') }}. You can move blocks to change the order of the sections. Keep {{ block('head') }} in the <head> of the template. It is required.

To see all of the variables, filters, and blocks, click here in the note above the editor.

View the default template

You can copy parts of the default template, or compare it with your template.

1. Click View Default PDF Template. The default template opens in a window.
2. To close the window, click Cancel.

Restore the default template

1. Click Restore Default PDF Template.
2. Click Yes to confirm.