Page tree
Skip to end of metadata
Go to start of metadata

Hostbill uses mPDF 5 to generate pdf documents, you can refer to its documentation for further guidance on configuration files.

Uploading font files

To be able to use custom fonts in pdf documents you will have to upload those font files to  hbf/libs/mpdf/ttfonts directory.

Only True Type Font (ttf) files are supported, if you have fonts in other format you will have to convert it to ttf. 

In this guide we will use Open Sans font with four styles (bold, italic, ...), if your font has only one file you should treat it as a "regular" style.

In case of Open Sans fonts you should have this file structure:


Setting up fonts

Each font that you want to use has to be added in hbf/libs/mpdf/config_fonts.php configuration file.

Font family name (array key) used in configuration has to be lower case, without spaces, if you use "OpenSans" as your css font-familly hostbill will look for "opensans".

Font file name (OpenSans-Regular.ttf) is case-sensitive.

$this->fontdata = array(
    'opensans' => [
        'R' => 'OpenSans-Regular.ttf',

You can define 4 font styles under the same name, the R (Regular) variant is required for each font familly, B (Bold), I (Italic), BI (Bold Italic) are optional.

If you specify additional variants it will allow mpdf to use correct fonts if you use font-weight or font-style properties in your CSS.

$this->fontdata = array(
    'opensans' => [
        'R' => 'OpenSans-Regular.ttf',
        'B' => 'OpenSans-Bold.ttf',
        'I' => 'OpenSans-Italic.ttf',
        'BI'=> 'OpenSans-BoldItalic.ttf'


If you are using auto upgrade, you should add hbf/libs/mpdf/config_fonts.php to excluded file list. Otherwise your changes will be overwritten when upgrading.

Accessing fonts

You will have to define font-family directly in html when editing invoice template, to do that click on "html" button available in formatting tools, this will open a popup with html source for you to edit.

If you want to apply your font to whole document, add or replace your style at the beginning with this code: 

<style type="text/css"><!--
    body {
        font-family: OpenSans;

If you want to use this font only on some elements, you can add your own css rules or use inline styles:

<div style="font-family:OpenSans;"> Hello World </div>
  • No labels