# Guide: Header and footer templates

When creating jobs, the `header_template` and `footer_template` parameters can be used to insert headers, footers, or both on each page.

{% hint style="warning" %}
Be sure to set a large enough `margin_top` (for headers) or `margin_bottom` (for footers).

Otherwise, the page content might overlap and hide your header or footer.
{% endhint %}

The template must be in HTML format. You can add the following classes to an element to substitute a dynamic value into that element on each page:

* `pageNumber` - the current page number
* `totalPages` - the total number of pages in the document
* `date` - the current date
* `title` - the title of the web page
* `url` - the URL of the web page

When setting a header or footer template, there are two crucial points to note:

1. You must use `header_template` in conjunction with `margin_top` and `footer_template` in conjunction with `margin_bottom`.
2. CSS from the web page does not flow down to the header or the footer. Specifically, you'll want to set a `font-size` for your template so that the text is legible.

## Example header or footer template

```markup
<div style='margin: auto; font-size: 10px; text-align: center; font-family: Roboto;'>
  Page
  <span class='pageNumber'></span>
  of
  <span class='totalPages'></span>
</div>
```

## Example API request

Here's an example new job API request (in JSON format) which sets a footer and a bottom margin:

```javascript
{
  "url": "https://en.wikipedia.org/wiki/Paper_plane",
  "footer_template": "Footer content goes here...",
  "margin_bottom": "3cm"
}
```