> 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FCYZVbGIzrKQIqGDCHPSL%2FScreenshot%202024-01-22%20at%2009.33.52.png?alt=media&amp;token=d340496a-f31c-48e8-bd24-8e737ddbb395" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FR4qhLojefhnY20aPCKsV%2FScreenshot%202024-01-22%20at%2009.41.07.png?alt=media&amp;token=aaa7ddb6-af14-4d27-a7be-b04480976cfd" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FZE8P0RGPyFr8VCrtFLM4%2FScreenshot%202024-01-22%20at%2009.35.05.png?alt=media&amp;token=0331b026-2942-4845-944f-e5b37556e6a1" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FNt1G3KzQNiw3rBoaOr1e%2FScreenshot%202024-01-22%20at%2009.42.53.png?alt=media&amp;token=fa6d12eb-1818-43c5-935c-6031180d9775" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FKeyTIn4WH9LSIZbHZ1Af%2Fimage.png?alt=media&amp;token=072fdb37-c01b-4c8b-8af0-6ec348bfcb3e" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FNKug6kOGkFn2LXSPeFmt%2Fimage.png?alt=media&amp;token=b9a2d7fc-80d6-4c64-bb09-a8010a8da409" alt="" width="375"><figcaption></figcaption></figure></div>

<div align="left"><figure><img src="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FKxoi38aae237AEUjbw3o%2FScreenshot%202024-01-22%20at%2009.22.05.png?alt=media&amp;token=1840e333-3f1b-4285-9697-95f84b499497" 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="https://302965189-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ2Vt9Y2GXGNYGZT9VYhX%2Fuploads%2FMdwWZT0xnFgWI0z3i7Xe%2FScreenshot%202024-01-22%20at%2009.47.07.png?alt=media&amp;token=1d950d70-02fa-4706-9f48-a4e4a2301fb0" 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/>" %}