The export plugin allows you to export your content directly from the Jodit editor to one of the supported formats (pdf, docs, etc.) your local machine.
You can change a number of options when exporting, such as:
CopyJodit.make('#editor', { exportDocs: { css: '* {color: red;}', options: { defaultFont: 'courier', format: 'A4', page_orientation: 'portrait' } } });
The options correspond to this interface:
Copyinterface exportDocs { ajax?: AjaxOptions; css: string; pdf: { allow: boolean; options: { defaultFont: | 'courier' | 'courier-bold' | 'courier-oblique' | 'courier-boldoblique' | 'helvetica' | 'helvetica-bold' | 'helvetica-oblique' | 'helvetica-boldoblique' | 'times-roman' | 'times-bold' | 'times-italic' | 'times-bolditalic' | 'symbol' | 'zapfdingbats'; format: 'A4'; page_orientation: 'landscape' | 'portrait'; }; }; }
PDF documents natively support the following fonts: Helvetica, Times-Roman, Courier, Zapf-Dingbats, and Symbol. These fonts are limited to Windows ANSI encoding. If you need to display characters outside the Windows ANSI range, you must use an external font. Dompdf can embed any font in the PDF as long as it has been preloaded or is accessible and referenced through CSS @font-face rules. For further details on font usage, refer to the font overview.
Server side comes with the DejaVu TrueType fonts pre-installed, offering good Unicode character support by default. To use these fonts, simply reference them in your CSS. For example: body { font-family: DejaVu Sans; } applies the DejaVu Sans font. The following DejaVu 2.34 fonts are included: DejaVu Sans, DejaVu Serif, and DejaVu Sans Mono.
To enable Unicode character support in your PDF, consider specifying a compatible font through the CSS configuration.
CopyJodit.make('#editor', { exportDocs: { css: 'body { font-family: DejaVu Sans; }' } });
But if you need your own font, you can specify it via the externalFonts
option:
CopyJodit.make('#editor', { exportDocs: { css: 'body { font-family: "Noto Sans KR", sans-serif !important; }', pdf: { externalFonts: [ 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', // As a link // Or as a <link> tag '<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet" />' ] } } });