Header & Footer

Headers and footers are sections that repeat on every page of your generated PDF. Use them for anything that should appear consistently across all pages — your company logo, a document title, page numbers, or contact information.

Enabling header and footer

In the left panel, check the Header and/or Footer checkboxes. You can enable one, both, or neither.

When enabled, the header appears as a zone at the top of the canvas and the footer at the bottom. They are separate from your sections — sections fill the space between the header and footer.

Adding content

Adding elements to a header or footer works the same way as with sections:

1. Select the Header or Footer in the Layers panel
2. Click + New Element
3. Choose your element type (Text, Image, etc.)
4. Position it within the zone

You can place any component inside a header or footer — text, images, shapes, barcodes, or QR codes.

Resizing

The header and footer span the full page width. You can only adjust their height:

• For the header, drag its bottom edge up or down
• For the footer, drag its top edge up or down

Keep in mind that the header and footer take space from every page, so keep them compact. A typical header or footer is between 40 and 80 pixels tall.

Common uses

Page numbers

Add a text element with system variables to show the current page and total pages:

Page {{sys.page_number}} of {{sys.total_pages}}

This updates automatically on each page.

Company logo

Add an image element with your logo. Position it in a corner or center it. You can also combine it with a text element for your company name.

Document title

A text element with a static title like “Invoice” or a dynamic one like {{document_type}}.

Date

Show when the PDF was generated:

Generated on {{sys.current_date}}

See System Variables for all available built-in date and time variables.

Contact information

A text element with your company address, phone number, email, or website. This is especially common in footers.

Styling

Select the header or footer to access its properties in the right panel:

• Fill — Add a background color to visually separate it from the main content
• Border — Customize the line between the header/footer and the body area
• Padding — Add inner spacing so content doesn’t touch the edges

Header, footer, and page margins

Page margins and the header/footer work together. The header sits inside the top margin area, and the footer sits inside the bottom margin area. Your sections occupy the space in between.

If you have both a header and large top margins, make sure the header height and margin are balanced so your layout looks right.

Next steps

• Sections — Structure the main body of your template
• Components — Learn about the elements you can place inside headers and footers
• System Variables — Page numbers, dates, and other built-in variables