Change font family in Magento PDF invoice layout

Chris

last updated on November 9, 2023

With my Advanced Invoice Layout extension it is easy to change the font family in the Magento PDF invoice.
Therefore the Advanced Invoice Layout extensions ships with several default fonts which you can choose from: Courier, DejaVu Sans, Helvetica, Times

Due to licensing issues it is not possible to add other font families by default, but you can also easily add your own font family with the following possibilities:

Use Internet Fonts, e.g. Google Fonts
Use Local Fonts, e.g. in TTF format

Case #1: Use Internet Fonts, e.g. Google Fonts

Note: this is supported by our Advanced Invoice Layout Extension for Magento 1 from version 2.3.16 or newer or for Magento 2

Additional fonts can easily be embedded via CSS, e.g. with Google Fonts:

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap');
body { font-family: Roboto !important }

Please note that in older versions of the used PDF library, the font files have to be downloaded and saved locally (due to a bug):

@font-face { font-family: 'Roboto'; src: url('/path/to/Roboto-Medium.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Roboto'; src: url('/path/to/Roboto-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; }
body { font-family: Roboto !important }

Case #2: Use local fonts, e.g. in TTF format

Advanced Invoice Layout for Magento 1 with version 2.3.16 or newer

You have to download the load_font.php utility from GitHub to the folder lib/dompdf-advancedinvoicelayout/ and change the third line of the file to

require_once "autoload.inc.php";

Then change into the directory lib/dompdf-advancedinvoicelayout.

Advanced Invoice Layout for Magento 2

You simply have to download the load_font.php utility from GitHub to the Magento root folder.

Then you need to make sure that the used DomPDF library gets to know the new font by executing the following command in the Magento root directory (replace MyFont with your desired font):
```
php -f load_font.php 'MyFont' /path/to/myfont
```
Finally you can use the font in your CSS with
```
font-family: MyFont;
```

Advanced Invoice Layout for Magento 1 with version 2.3.15 or older

You need to temporarily rename the file lib/dompdf/dompdf_config.custom.inc.php to something else.
Then change into the directory lib/dompdf-advancedinvoicelayout.
Execute the above mentioned load_font.php command.
Afterwards inject the new font into the XML config object (see app/code/community/Vianetz/AdvancedInvoiceLayout/etc/config.xml) by extending the XML node default/advancedinvoicelayout/fonts, e.g.
```
<verdana title="Verdana"/>
```
The node title must match the generated file in step 2.

And that's it! Now you can choose the new font family in the configuration section under System › Configuration › Advanced Invoice Layout.

For further explanations see also the PDF Library documentation about About Fonts and Character Encoding.

« Back to the FAQ overview