> For the complete documentation index, see [llms.txt](https://cranford-tech.gitbook.io/pdf-creator/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cranford-tech.gitbook.io/pdf-creator/implementing-key-features/adding-headers.md).

# Adding headers

### Video Tutorial

The below video tutorial demonstrates how to add headers to PDFs:

{% embed url="<https://www.youtube.com/watch?v=R3KLaXYpZNw>" %}

### Instructions

* Add text (static or dynamic) to the left or right hand-side of your header using the 'Left Header Content' and 'Right Header Content' fields

<div align="left"><figure><img src="/files/xz7UeseRM754rmQkt3VJ" alt="" width="375"><figcaption></figcaption></figure></div>

* Modify the color of the text in the header using the 'Font Color' field

<div align="left"><figure><img src="/files/CC7iYyEKZ3f1A9GAfPQo" alt="" width="375"><figcaption></figcaption></figure></div>

* Customise the font size of the text in the header using the 'Font Size' field and the margins using the Top and Left/Right Margin fields

<div align="left"><figure><img src="/files/4NX50SkRa2BwjrowID3m" alt="" width="375"><figcaption></figcaption></figure></div>

#### **Special Commands**

The PDF Creator has two special commands for adding content to headers (and footers)

#### **Adding a page counter to your header**

You can add a page-counter to the header of the PDF by adding 'page-counter' to the Left/Right Header Content fields.

<div align="left"><figure><img src="/files/quNBpKq3sr5fuf6PSPOV" alt="" width="375"><figcaption></figcaption></figure></div>

**Adding a logo to your header**

You can add a logo to the header of the PDF. You will need to upload an image (either JPEG or PNG) in the 'IMAGE FOR HEADER/FOOTER' section of the 'Generate PDF Creator' action.

<div align="left"><figure><img src="/files/qmCceXmiaFpCsndjwLG2" alt="" width="375"><figcaption></figcaption></figure></div>

You will also need to specify a 'Width' and a 'Height' for the image you've uploaded. It is **highly recommended** you set these dimensions to equal the dimensions of the image you uploaded.

<div align="left"><figure><img src="/files/CgfJHw8c5eOi3HsNN0TI" alt="" width="375"><figcaption></figcaption></figure></div>

<div align="left"><figure><img src="/files/KRzmnxwRV2bUiqKZk5zr" alt="" width="375"><figcaption></figcaption></figure></div>

You can then add the image to your header (or footer) by adding 'my-image' to the Left/Right Header Content field.

<div align="left"><figure><img src="/files/Pbd9EZRs7ZsvDtDx2T0g" alt="" width="375"><figcaption></figcaption></figure></div>

### Demo app

You can view an example of how to add headers to your PDFs in the demo app at the below link (relevant section is the 'Adding a header to your PDF' section)

{% embed url="<https://pdf-creator-demo.bubbleapps.io/>" %}