aklump/dompdf-fonts

Simplify the usage of TrueType fonts with DomPDF.

0.0.18 2024-03-19 23:22 UTC

Requires

• dompdf/dompdf: ^1.0|^2.0
• symfony/filesystem: ^4.4|^5.4
• symfony/yaml: ^4.4|^5.4

BSD-3-Clause

• Aaron Klump

README

I wrote this project to simplify using custom fonts with DOMPDF.

Installation

1. composer require aklump/dompdf-fonts
2. Create a directory in your project to hold the source fonts and the configuration file.
3. Copy the config file found in vendor/aklump/dompdf-fonts/dompdf-fonts.config.dist.yml to the font folder as dompdf-fonts.config.yml.

In a Drupal Module

Installation

1. cd my_module
2. Install as a dev requirement: composer require --dev aklump/dompdf-fonts
3. mkdir fonts
4. cp vendor/aklump/dompdf-fonts/dompdf-fonts.config.dist.yml fonts/dompdf-fonts.config.yml

Importing

1. Copy source font into fonts/.
2. ./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

Get the .ttf font files

1. Download one or more font families, say from https://fonts.google.com
2. 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.
3. 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

Set the import configuration

1. 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.
2. 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 the importer

1. Run php vendor/bin/import.php path/to/dompdf-fonts.config.yml to process your fonts.
2. Inspect to make sure your output directory contains the necessary files.

Use with Dompdf instances

1. 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);

Use with HTML markup

1. 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;
}

Resource Links

• https://opentype.js.org/font-inspector.html
• https://fontforge.org/en-US/