How to use header and footer templates?

This guide highlights all the necessary information on how and when to use header and footer templates


Limitations and caveats

Due to our rendering engine being based on chromium we have the following limitations:

  1. External resource cannot be loaded, this includes stylesheets, images, javascript or external fonts. For images you can use base64 encoded data URIs, and for CSS you can use inline styles.
  2. No javascript execution possible.
  3. Chromium wraps the footer and header html, so make sure not to use a root html or body tag, as this leads to invalid HTML and ultimately to wrongly rendered items.

Chromium is known for having scaling issues in the header or footer, leading to smaller displayed items especially noticeable on fonts.
But don't worry, we make sure your content is displayed correctly!


When to use header or footer templates?

Our recommendation is to use header and footer templates, when your content is free flowing like a text document, e.g. contracts, invoices or text reports. When you have a fixed page template, e.g. like a graphical report or a menu, then it might be easier to includer page header and footer into the main template and repeat them

When using header or footer templates, don't forget to set margins, otherwise they won't be displayed up.


Special CSS classes

The following CSS classes are supported in header and footer elements:

  • An element with the class .pageNumber will output the current page number, starting with 1.
  • An element with the class .totalPages will output the total number of pages in the document.

Alternative: Use paged.js

Instead of using header and footer elements, your main template can integrate paged.js, which takes care of paginating the HTML for your PDF document. It additionally allows you to use Javascript and external resources in the header and footers, as those are defined in the main HTML template too (Reference). Be aware, using paged.js significantly increases the rendering time due to the computation of the layout.