I wrote this project to simplify using custom fonts with DOMPDF.
composer require aklump/dompdf-fonts
- Create a directory in your project to hold the source fonts and the configuration file.
- Copy the config file found in vendor/aklump/dompdf-fonts/dompdf-fonts.config.dist.yml to the font folder as dompdf-fonts.config.yml.
cd my_module
- Install as a dev requirement:
composer require --dev aklump/dompdf-fonts
mkdir fonts
cp vendor/aklump/dompdf-fonts/dompdf-fonts.config.dist.yml fonts/dompdf-fonts.config.yml
- Copy source font into
fonts/
. ./vendor/bin/import.php fonts/dompdf-fonts.config.yml
For example:
composer require aklump/dompdf-fonts
mkdir fonts
cp vendor/aklump/dompdf-fonts/dompdf-fonts.config.dist.yml fonts/dompdf-fonts.config.yml
- Download one or more font families, say from https://fonts.google.com
- For use with DomPDF you only need the .ttf versions. Copy those to your source directory. In the examples shown below, that directory is ./fonts.
- You will need up to four versions of the font: normal, bold, italic and bold italic.
Example file tree.
.
├── dist
│  └── dompdf_fonts
│  ├── Merriweather--bold-italic.ttf
│  ├── Merriweather--bold-italic.ufm
│  ├── Merriweather--bold.ttf
│  ├── Merriweather--bold.ufm
│  ├── Merriweather--italic.ttf
│  ├── Merriweather--italic.ufm
│  ├── Merriweather--normal.ttf
│  ├── Merriweather--normal.ufm
│  ├── _style.scss
│  └── installed-fonts.json
└── fonts
├── dompdf-fonts.config.yml
├── Merriweather--bold-italic.ttf
├── Merriweather--bold.ttf
├── Merriweather--italic.ttf
├── Merriweather--normal.ttf
└── dompdf
└── import.php
- dompdf-fonts.config.yml should have been copied from dompdf-fonts.config.dist.yml when you installed this, if not you must manually do so now.
- Update dompdf-fonts.config.yml as appropriate. All paths are relative to dompdf-fonts.config.yml's parent directory.
File: _dompdf-fonts.config.yml
sources:
- ../Merriweather*.ttf
output: ../../dist/dompdf_fonts/
- Run
php vendor/bin/import.php path/to/dompdf-fonts.config.yml
to process your fonts. - Inspect to make sure your output directory contains the necessary files.
- Set the fonts directory to match
output.path
on every new DOMPDF instance in your code. This is an example from a Drupal 9 module.
$options = new \Dompdf\Options();
// Determine the configuration directory by reading the import config.
$fonts_base_path = \Drupal::service('extension.list.module')
->getPath('my_module') . '/fonts';
$fonts_config = \Symfony\Component\Yaml\Yaml::parseFile($fonts_base_path . '/dompdf-fonts.config.yml');
$fonts_dir = realpath($fonts_base_path . '/' . $fonts_config['output']['path']);
$options->setFontDir($fonts_dir);
$dompdf = new \Dompdf\Dompdf($options);
- To see your font in the browser you must import the SCSS partial. When only rendering PDFs, DOMPDF does not use _style.scss.
File: my_module/scss/_pdf.scss
@import "../dist/dompdf_fonts/style";
@mixin pdf_font_serif {
font-family: Merriweather, Georgia, Times, "Times New Roman", serif;
}
h1 {
@include pdf_font_serif;
}