Skip to Content
EditorHeader & Footer

Header & Footer

Headers and footers are special sections that repeat on every page of your generated PDF. They’re perfect for company logos, document titles, page numbers, and other consistent information.

What Are Page Sections?

Header

  • Appears at the top of every page
  • Great for logos, document titles, dates

Footer

  • Appears at the bottom of every page
  • Great for page numbers, copyright notices, contact info

When your PDF spans multiple pages, the header and footer content automatically repeats on each page.

In the left panel, you’ll find checkboxes to toggle these sections:

  • Header - Check to add a header zone at the top of the page
  • Footer - Check to add a footer zone at the bottom of the page

You can enable one, both, or neither depending on your needs.

Working with the Header

When enabled, the header appears as a distinct zone at the top of your canvas:

  • Default height: 60 pixels (adjustable)
  • Width: Full page width (100%)
  • Visual separator: A subtle border at the bottom

Resizing: Drag the bottom edge of the header to make it taller or shorter. The header only resizes vertically - width always matches the page.

Adding Content: Add elements inside the header just like anywhere else:

  1. With the header visible, click “Add element”
  2. Choose your element type (Text, Image, etc.)
  3. Position it within the header zone

When enabled, the footer appears at the bottom of your canvas:

  • Default height: 60 pixels (adjustable)
  • Width: Full page width (100%)
  • Visual separator: A subtle border at the top
  • Position: Automatically sticks to the page bottom

Resizing: Drag the top edge of the footer to adjust its height.

Adding Content: Same process as the header - add and position elements within the footer zone.

Common Header/Footer Content

Add an Image element with your logo. Position it in a corner or center it.

Document Title

Add a Text element with a title like “Invoice” or “Certificate”. You can also use a variable:

{{document_title}}

Page Numbers

Add a Text element with page number variables:

Page {{page_number}} of {{total_pages}}

This automatically updates on each page of multi-page documents.

Date

Display the current date when the PDF was generated:

{{current_date}}

Contact Information

Add your company address, phone, email, or website in a Text element.

Select the header or footer zone to access its styling options in the right panel:

Dimensions

  • Height only (width is always 100%)

Fill

  • Add a background color to visually separate the header/footer from the main content

Border

  • Customize the separator line between header/footer and body

Padding

  • Add inner spacing so content doesn’t touch the edges

Tips

  • Keep headers and footers concise - they take space from every page
  • Use consistent styling across header and footer for a professional look
  • Test with multi-page content to see how they repeat
  • Consider using a subtle background color to distinguish these sections

Next Steps

  • Tables - Create structured data layouts
  • Styling - Full styling reference
Last updated on