> For the complete documentation index, see [llms.txt](https://docs.heisenware.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.heisenware.com/app-builder/build-frontend/pdf-template-editor.md).

# PDF Template Editor

The PDF Template Editor provides a visual workflow for designing dynamic documents. You create a Template by placing dynamic Placeholders onto an uploaded PDF background.

{% hint style="info" %}
The Template Editor works exclusively with the [PDF Template](/app-builder/build-backend/function-explorer/utilities/pdf-templates.md) Class. When you create a Template, an Instance is automatically generated within this Class, containing the `fillTemplate` Function required to populate your document with data.

To see the complete process in action, follow our [step-by-step guide](/tutorials/app-templates/automating-pdf-reports.md).
{% endhint %}

## Creating a PDF Template

{% stepper %}
{% step %}

#### Open Template mode

Select Template Editing mode from the main Toolbar. <img src="/files/0As2rr3Xe0MuEsKUktVT" alt="" data-size="line">
{% endstep %}

{% step %}

#### Define properties

Enter a unique name for your Template and choose a standard page size (`A4`, `A5`, or `Letter`).
{% endstep %}

{% step %}

#### Generate Instance

Click Create Template. This automatically generates the corresponding Instance in your Function Explorer.
{% endstep %}
{% endstepper %}

<figure><img src="/files/RDd5JbrfNhnxUPop4O12" alt="" width="563"><figcaption></figcaption></figure>

## Designing the layout

Once your Template is created, set up the visual background and place your dynamic fields.

### Managing pages and backgrounds

To use an existing document as a layout, first upload its pages as separate PDF files to the [File Explorer](/app-builder/build-backend/file-explorer.md).

{% stepper %}
{% step %}

#### Add blank pages

Add a blank page for each page of your source document using the Add Page icon (<i class="fa-circle-plus">:circle-plus:</i>).
{% endstep %}

{% step %}

#### Set background

Drag each page file from the File Explorer onto the corresponding blank page. This sets the file as a static background.
{% endstep %}

{% step %}

#### Organize

Right-click a page to open the context menu. Here you can move pages up or down, or manage the layering (Bring to Front / Send to Back).
{% endstep %}
{% endstepper %}

{% hint style="danger" %}
Deleting a page (using the Trash icon) is a permanent action that removes the page, its background, and all Placeholders on it. It is not currently possible to simply replace the background of an existing page.
{% endhint %}

### Placing and configuring Placeholders

Placeholders are the dynamic slots where your logic inserts data.

{% stepper %}
{% step %}

#### Add Placeholder

Click the Text or Image Placeholder icon in the Toolbar (<i class="fa-text-size">:text-size:</i>, <i class="fa-image">:image:</i>), then click the page to place it.
{% endstep %}

{% step %}

#### Assign variable

Select the Placeholder and click the gear icon. Provide a variable name (e.g., `firstName`).
{% endstep %}

{% step %}

#### Style

Adjust the font, size, or colors for text, or resize the bounding boxes to define the final content area.
{% endstep %}
{% endstepper %}

{% hint style="info" %}

#### Data matching

The variable name you enter (e.g., `invoiceNumber`) must exactly match the key in the data object you provide in your backend logic later. The editor adds the `<>` tags automatically.
{% endhint %}

<figure><img src="/files/mHS4O462uvfdVajA2vQR" alt="" width="563"><figcaption></figcaption></figure>

## Populating the Template

To bring your PDF to life, use the [`fillTemplate`](/app-builder/build-backend/function-explorer/utilities/pdf-templates.md#filltemplate) Function within your backend logic. This Function is the engine: it takes a data object (like a JSON object from a database), merges the values into your visual Placeholders, and outputs the finished PDF document. For detailed input and output specifications, see the [PDF Templates Class documentation](/app-builder/build-backend/function-explorer/utilities/pdf-templates.md).

To see these concepts in action, follow our step-by-step guide on [automating PDF reports](/tutorials/app-templates/automating-pdf-reports.md).

## Deleting a Template

If you no longer need a PDF Template, you can permanently remove it and its associated Function:

1. Navigate to the [Function Explorer](/app-builder/build-backend/function-explorer.md).
2. Open the PDF Templates Class.
3. Right-click the specific Template Instance.
4. Select Remove.

{% hint style="danger" %}
This action is irreversible. Deleting an Instance removes it completely. Any logic in your Backend Builder referencing this Template will break.
{% endhint %}

<figure><img src="/files/NrE3f9QhX2Rs1SidHfxt" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.heisenware.com/app-builder/build-frontend/pdf-template-editor.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
