Adding page breaks to specific elements

PDF Potion allows you to add page breaks before any element on your page.

For example, let's say you want to add a page break so that the "Introduction" section in the below PDF starts on a new page.

To do this, follow these steps:

• In your Bubble editor, navigate to: Settings -> General -> Advanced Options and add the ability to 'Expose the option to add an ID attribute to HTML elements'
• Add an ID attribute to the element where you want to insert the page break. In this example, we're adding the ID attribute 'break-1' to the text element's parent group

Note: it is recommended you add the ID attributes to group elements, rather than individual text elements

• Add the ID attribute to the 'Element Page Break' field of your 'Create PDF' workflow action

Now when you create a PDF from your Bubble app, the element you've added a page break to will start on a new page:

Adding Multiple Page Breaks to a Page

You can add multiple page breaks on the same page. In this example, we've added an additional page break ('break-2') to another group on our page. This is how it looks in our 'Create PDF' workflow looks after adding a second element page break:

Please note that you can not add a page break to a child element of an element that you have already added a page break to.