The header_template and footer_template parameters allow you to add custom HTML content to the top and bottom of each page in your PDF.

​
Overview

When generating PDFs, it’s often useful to include consistent headers and footers on each page. These templates support special CSS classes for dynamic content like page numbers, dates, and titles.

​
Parameter details

​
header_template
string

HTML content to display at the top of each page

Note: render_header_footer must be set to true for this template to take effect

​
footer_template
string

HTML content to display at the bottom of each page

Note: render_header_footer must be set to true for this template to take effect

​
render_header_footer
boolean
default:false

Must be set to true for header and footer templates to be rendered

​
Usage

{
  "parts": "https://example.com",
  "render_header_footer": true,
  "header_template": "<div style='font-size: 10px; width: 100%; text-align: center;'>Document Title</div>",
  "footer_template": "<div style='font-size: 10px; width: 100%; text-align: center;'><span class='pageNumber'></span> of <span class='totalPages'></span></div>"
}

​
Special CSS classes

Both templates support these special CSS classes for dynamic content:

  • date: Current date when the PDF is generated
  • title: Title of the document (from the HTML <title> tag)
  • url: URL of the page being rendered
  • pageNumber: Current page number
  • totalPages: Total number of pages in the document

​
Styling guidelines

  1. Templates must contain valid HTML
  2. Use inline styles for consistent rendering
  3. Set explicit width (usually width: 100%) for proper alignment
  4. Keep content within reasonable height to avoid overlapping with main content
  5. Use font sizes appropriate for headers/footers (typically 8-12px)

​
Use cases

These parameters are particularly useful for:

  1. Professional documents: Add company logos, document titles, and page numbers
  2. Reports: Include generation date, version information, and pagination
  3. Legal documents: Add disclaimers, confidentiality notices, or document identifiers
  4. Printed materials: Include contact information or copyright notices

​
Examples

​
Basic page numbers

{
  "parts": "https://example.com",
  "render_header_footer": true,
  "footer_template": "<div style='font-size: 10px; width: 100%; text-align: center;'>Page <span class='pageNumber'></span> of <span class='totalPages'></span></div>"
}

{
  "parts": "https://example.com",
  "render_header_footer": true,
  "header_template": "<div style='font-size: 10px; width: 100%; display: flex; justify-content: space-between;'><img src='https://example.com/logo.png' height='20px'><div style='align-self: center;'><span class='title'></span></div></div>"
}

{
  "parts": "https://example.com",
  "render_header_footer": true,
  "footer_template": "<div style='font-size: 8px; width: 100%; display: flex; justify-content: space-between;'><div>Generated on <span class='date'></span></div><div><span class='url'></span></div></div>"
}

​
Three-column layout

{
  "parts": "https://example.com",
  "render_header_footer": true,
  "footer_template": "<div style='font-size: 8px; width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr;'><div>CONFIDENTIAL</div><div style='text-align: center;'><span class='pageNumber'></span>/<span class='totalPages'></span></div><div style='text-align: right;'><span class='date'></span></div></div>"
}