Page Breaks
Page breaks give you control over how your document content flows across multiple pages in the generated PDF. You can use page breaks in two ways:
Where to find page break settings
Page break options are available in the Properties panel for any component in the template editor:
- Open a template in the Editor.
- Click on any component in the canvas to select it.
- In the Properties panel on the right, scroll down to the Page Breaks.
- Click on the Page Breaks header to expand it if it's collapsed.
Page break options are not available on nested components. You won't have the option to add page break options to components that have been dropped into a container or a repeating child element.
Start a component on a new page
This option forces the selected component to always appear at the top of a new page in the generated PDF. Any content above it will stay on the previous page.
This is useful when you want a specific section of your document — like a summary, terms and conditions, or a signature block — to always begin on its own page.
To force a page break:
- Select the component you want to start on a new page.
- In the Page Breaks section of the Properties panel, set Start on New Page to Yes
To disable it, click No to return to the default behavior.
Technical note: Setting 'Start on New Page' to 'Yes' adds the CSS property 'break-before:page' to that component in your PDF
In the below example, let's say you wanted to start the Container component that has the Terms and Conditions on a new page of your PDF.
In the output PDF, the Terms and Conditions Container starts on a new page:
Prevent components from being split across pages
This option prevents the selected component from being split across two pages. If the component doesn't fit on the current page, the entire component will be moved to the next page instead of being cut off.
This is especially helpful for components like tables, containers with grouped content, or text blocks that should remain intact for readability.
To enable it:
- Select the component you want to keep together.
- In the Page Breaks section of the Properties panel, click Yes next to Keep Together.
When enabled, the button turns green. To disable it, click No to return to the default behavior.
Technical note: Setting 'Keep Together' to 'Yes' adds the CSS property 'break-inside:avoid' to that component in your PDF
In the below example, the Keep Together property on the 'Contact Us' container component is set to no':
This results in the container being split across pages in the output PDF:
But when 'Keep together' is set to 'yes', then the container is moved onto the second page:
The output PDF document:
