4. Headers, footers and page numbers

Before this: You have a document with more than one page.

Everything so far went in the first argument, which is content. Page furniture goes in the second argument, which is layout.

const bytes = buildDocumentPDFBytes(
  { title: 'Quarterly report', blocks },
  {
    headerTemplate: { left: '{title}', right: '{date}' },
    footerTemplate: { center: 'Page {page} of {pages}' },
  },
);

Each template takes left, center and right, plus optional fontSize and color. Four placeholders are substituted per page:

• {page} — the current page number
• {pages} — the total page count
• {date} — the generation date
• {title} — the document title

One thing to remember about {pages}

It needs the total page count, which is only known once the whole document has been laid out. That is fine here, but it makes {pages} incompatible with streaming — see step 7. If you might stream later, prefer {page} alone.

There is also a shortcut on the content object: footerText: 'Confidential'. It is not quite a plain string — it fills the left zone of the default footer, and that default also stamps {page}/{pages} on the right. Placeholders work there too. If you want full control of all three zones, use footerTemplate instead.

Tip: Alt + ← / → moves between steps.