I am using Zend Framework and creating PDF with mpdf.
I am trying to use fontawesome for denoting some of the articles but the fonts of font awesome are not rendering properly
below is the code .
$stylesheet = file_get_contents("https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css");
$stylesheet .= file_get_contents("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");
$this->mpdf->WriteHTML($stylesheet,1);
$this->mpdf->WriteHTML($html,2);
$this->mpdf->allow_charset_conversion = true;
$this->mpdf->charset_in = 'windows-1252';
$this->mpdf->Output();
The code I am using in the html
<span class="company-name"> name of the company</span>
Thanks in advance.
CSS has an awesome feature called Pseudo-elements . Using Pseudo-elements we can add content to the web page with just CSS. Font awesome uses ::before pseudo-element to add icons to the page using their CSS content codes.
EDIT: Nowadays, this is an obsolete method, and should only be used on legacy systems.
I recommend the answer below, from @Arie, to modify the mPDF font in its recent versions and/or if it was installed by Composer, passing the parameters when instantiating the class.
The easy way:
Copy fontawesome-webfont.ttf
file into /mPDF/ttfonts/
directory.
Edit /mPDF/config_fonts.php
, search the array started by $this->fontdata
and add to it:
"fontawesome" => array(
'R' => "fontawesome-webfont.ttf",
),
$stylesheet = '.company-name { font-family: fontawesome; }';
Eg.:
$mpdf = new mPDF();
or
$mpdf = new mPDF('', 'A4');
I am tested with mPDF 6.0 and it worked.
Also, the mPDF manual explain how to do it with more options: Fonts in mPDF 6.x
A more recent solution for Font Awesome 5.x and mPDF 7.x, when you don't want to edit the source files/dirs from mPDF: https://mpdf.github.io/fonts-languages/fonts-in-mpdf-7-x.html
My use case, this offers usage of mPDF supplied fonts, fontawesome and another custom font (ibmplex in this case). Note that when supplying a font name such as 'ibmplex' and 'fontawesome', they are lowercase. To avoid confusion why a font doesn't work, I'd advice using lower case and no spaces for the names.
$defaultConfig = (new Mpdf\Config\ConfigVariables())->getDefaults();
$fontDirs = $defaultConfig['fontDir'];
$defaultFontConfig = (new Mpdf\Config\FontVariables())->getDefaults();
$fontData = $defaultFontConfig['fontdata'];
$mpdf = new \Mpdf\Mpdf([
'fontDir' => array_merge($fontDirs, [
__DIR__ . '/../../resources/fonts',
]),
'fontdata' => $fontData + [
'ibmplex' => [
'R' => 'IBMPlexSans-Regular.ttf',
'B' => 'IBMPlexSans-Bold.ttf',
'I' => 'IBMPlexSans-Italic.ttf',
],
'fontawesome' => [
'R' => 'fa-solid-900.ttf'
],
],
'default_font' => 'ibmplex',
'format' => 'A4'
]);
Then you can use
<span style="font-family: fontawesome;"></span>
As per https://fontawesome.com/cheatsheet -- note that f3ed is the actual icon in this case.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With