Give each report section enough space, keep its heading with its text, and add page numbers that match the finished file. This guide makes a two-page PDF from a saved HTML template. You can reuse the same request when you check a longer report. Each successful PDF costs one credit, including this two-page example.
How to do a page break in HTML?
Put break-before: page on the block that starts the next printed page. It affects printed output, so you might not see the break in an ordinary browser view. A forced break takes priority over an avoid rule. The MDN break-before reference explains these rules.
.next-page {
break-before: page;
}
h1,
h2 {
break-after: avoid;
}
tr,
.total {
break-inside: avoid;
}
Keep the total and its label in one block. A block taller than a page can't stay on one page. Check short and long records, and let table rows grow with their content.
The Campaign results report keeps the result, summary, and next step in clear sections. Its gallery version is a one-page design. The recipe below uses two small sections, so the page break is easy to check.
How to do page break in PDF?
Set the breaks in the HTML before you create the PDF. The input is HTML or a saved template. You can't edit the pages of an existing PDF here. Use this recipe to check breaks and page numbers together.
You need curl and an API key. Set THIRDS_API_KEY through your secret store. Saving the template is free. The create request uses one credit when it succeeds.
Save this JSON as page-break-template.json:
{
"source": "<!doctype html><html lang='en'><head><meta charset='utf-8'><style>body{margin:0;font:16px/1.5 sans-serif;color:#152335}h1{font-size:28px}h1,h2{break-after:avoid}.next-page{break-before:page}</style></head><body><section><h1>Quarterly report</h1><p>Orders completed: 24</p><p>Prepared for Northline Studio.</p></section><section class='next-page'><h2>Next steps</h2><p>Send the approved report to your team.</p></section></body></html>",
"schema": {
"type": "object",
"properties": {},
"additionalProperties": false
}
}
Save the template response to a private file. If the request loses its response, check Templates for the saved copy before you send another save.
umask 077
curl --fail-with-body --silent --show-error \
https://thirds.ai/v1/templates \
-H "Authorization: Bearer $THIRDS_API_KEY" \
-H 'Content-Type: application/json' \
--data-binary @page-break-template.json \
--output page-break-saved.json
Read the template id from page-break-saved.json. Save this JSON as page-break-request.json and put your ID in it. It uses version 1 of the new template and leaves room for a header and footer:
{
"template_id": "tpl_00000000000000000000000000000000",
"version": 1,
"data": {},
"pdf": {
"format": "A4",
"margins": {
"top": "20mm",
"right": "12mm",
"bottom": "20mm",
"left": "12mm"
},
"display_header_footer": true,
"header_template": "<span style='font-size:9px;width:100%;text-align:center'>Quarterly report</span>",
"footer_template": "<span style='font-size:9px;width:100%;text-align:center'><span class='pageNumber'></span> / <span class='totalPages'></span></span>"
},
"wait": false
}
This request makes one PDF and spends one credit when it succeeds. Choose your own Idempotency-Key for it.
curl --fail-with-body --silent --show-error \
https://thirds.ai/v1/pdf \
-H "Authorization: Bearer $THIRDS_API_KEY" \
-H 'Content-Type: application/json' \
-H 'Idempotency-Key: YOUR_UNIQUE_PAGE_BREAK_REQUEST' \
--data-binary @page-break-request.json
Keep the id from the response. Read the job until its status is succeeded, and replace the sample ID with yours:
curl --fail-with-body --silent --show-error \
https://thirds.ai/v1/pdf/pdf_00000000000000000000000000000000 \
-H "Authorization: Bearer $THIRDS_API_KEY"
Copy download.url from that response and add https://thirds.ai before it. The download doesn't need your API key.
curl --fail --silent --show-error \
'https://thirds.ai/v1/downloads/YOUR_SIGNED_DOWNLOAD_TOKEN' \
--output page-break.pdf
Open page-break.pdf. Check that it has two pages. Page 1 holds Quarterly report, and page 2 starts with Next steps. Both pages have the header, and their footers read 1 / 2 and 2 / 2. The job's artifact field has the file's byte_size and sha256 if you want to check your download.
If the create request stops, send it again with the same key and the same file. For a changed design, use a new key. The recovery guide explains when another create request is needed.
Why do headers or fonts look different?
Header and footer templates have their own styles. They don't inherit the body font or run scripts. Set their font size in the template and leave enough page margin for them. The PDF options guide has the thirds.ai settings, and the underlying Puppeteer PDF options describe header and footer behavior.
The recipe uses a generic font and no remote assets. For a brand font, use a licensed web font or a brand kit. A remote renderer can't see a font that only lives on your laptop. Test accented names, currency signs, and every script your customers use. Keep font file versions fixed because a changed font can move text onto another page.
| Result | Check |
|---|---|
| An extra blank page | Remove a forced break after the last section. |
| A heading sits alone | Set break-after: avoid and check the next block fits. |
| A footer is missing or clipped | Set display_header_footer and increase the bottom margin. |
| A row loses text | Remove fixed heights and clipping from the row. |
| A font changes | Check its URL, license, supported glyphs, and remote access. |
idempotency_conflict | Send the old request again, or use a new key for a new output. |
How to convert HTML to single page PDF?
Choose a paper size that fits the content and remove forced page breaks. For a short report, reduce empty space before you reduce the type size. Keep the text readable. You can use a named paper size or a custom width and height. The request controls the paper size, and a CSS @page size doesn't override it.
A one-page requirement needs a content limit. Test the longest names and largest table you accept. If the content grows beyond that limit, let the report use another page or shorten the content in your app.
How can I print a webpage as a PDF without page breaks?
A PDF still has page boundaries. A taller custom page can hold more content on one page, but the whole result must fit the renderer's size and output limits. Removing CSS breaks alone doesn't make a long page fit.
You send the HTML yourself, because the API doesn't fetch a webpage URL. Prepare the HTML and its print styles first. If you need a fixed graphic instead, use the image options and set its width and height.
Next, open the Campaign results report and check your longest real record with the PDF options guide.
