Template & Styling
Last updated
Last updated
The heart of the PDF content, isn't it? For this, you need to send a whole HTML document.
Recommended:
If you want to use footer or header or both, you need to send a whole HTML document, e.g.:
The following classes allow you to inject printing values:
date
- formatted print date.
title
- document title.
url
- document location.
pageNumber
- current page number.
totalPages
- total pages in the document.
No JavaScript.
The CSS properties are independent of the ones from the HTML document.
Also simple CSS only.
footer.html
CSS properties override the ones from header.html
.
Images only work using a base64 encoded source - i.e., data:image/png;base64, iVBORw0K...
.
background-color
and color
CSS properties require an additional -webkit-print-color-adjust: exact
CSS property to work.
Assets are not loaded (i.e., CSS files, scripts, fonts, etc.).
For fonts, check out the section below.
Background form fields do not apply.
Here are the built-in fonts that you can define in your styles.
Andale Mono
Arial Black
Arial (Bold, Italic, Bold Italic)
Comic Sans MS (Bold)
Courier New (Bold, Italic, Bold Italic)
Georgia (Bold, Italic, Bold Italic)
Impact
Times New Roman (Bold, Italic, Bold Italic)
Trebuchet (Bold, Italic, Bold Italic)
Verdana (Bold, Italic, Bold Italic)
Webdings
beng
hosny-amiri
lklug-sinhala
lohit-guru
lohit-knda
samyak-gujr
samyak-mlym
samyak-taml
sarai
sil-abyssinica
sil-padauk
telu thai-tlwg
ttf-wqy-zenhei
arphic-ukai
arphic-uming
ipafont-mincho
ipafont-gothic
uncore
crosextra-caladea
crosextra-carlito
dejavu
dejavu-extra
liberation
liberation2
linuxlibertine
noto-cjk
noto-core
noto-mono
noto-ui-core
sil-gentium
sil-gentium-basic
In case that you want to have a page break, you can use this CSS styling to achieve that: