如何在 MPDF 中使用 Font Awesome?
Posted
技术标签:
【中文标题】如何在 MPDF 中使用 Font Awesome?【英文标题】:How to use Font Awesome with MPDF? 【发布时间】:2015-07-15 13:46:11 【问题描述】:我正在使用 Zend Framework 并使用 mpdf 创建 PDF。 我正在尝试使用 fontawesome 来表示一些文章,但是 font awesome 的字体没有正确渲染 下面是代码。
$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();
我在 html 中使用的代码
<span class="company-name"> name of the company</span>
提前致谢。
【问题讨论】:
看,我使用 php 大约 5 或 6 年,每次我需要创建 PDF 时,都不符合我的期望(CSS 或其他一些元素)。所以,我发现(在 *** 中)一个 API,你只发送你的 HTML,他们返回一个与你的页面完全一样的 PDF。试试看:html2pdfrocket.com 【参考方案1】:编辑:如今,这是一种过时的方法,只应在旧系统上使用。
我推荐the answer below, from @Arie,在其最新版本中修改 mPDF 字体和/或如果它是由 Composer 安装的,则在实例化类时传递参数。
简单的方法:
将fontawesome-webfont.ttf
文件复制到/mPDF/ttfonts/
目录中。
编辑/mPDF/config_fonts.php
,搜索$this->fontdata
开头的数组并添加:
"fontawesome" => array(
'R' => "fontawesome-webfont.ttf",
),
-
使用新字体系列正确更改文档 CSS。例如:
$stylesheet = '.company-name font-family: fontawesome; ';
-
实例化类时,将第一个参数留空:
例如:
$mpdf = new mPDF();
或
$mpdf = new mPDF('', 'A4');
我使用 mPDF 6.0 进行了测试,并且它工作正常。
此外,mPDF 手册解释了如何使用更多选项进行操作: Fonts in mPDF 6.x
【讨论】:
好主意!添加了$pdf->WriteHTML('.fa font-family: fontawesome;',1);
,所以我可以像真实一样使用它:<i class="fa">&#xf0e7;</i>
作为flash 的示例。 unicode 位于页面大图标的正下方,并且必须以&#x
为前缀。
@MartinSchilliger 好主意,效果很好...但我添加了font-style: normal;
,因为默认情况下<i>
标签以斜体显示图标!【参考方案2】:
当您不想从 mPDF 编辑源文件/目录时,Font Awesome 5.x 和 mPDF 7.x 的更新解决方案:https://mpdf.github.io/fonts-languages/fonts-in-mpdf-7-x.html
我的用例,这提供了使用 mPDF 提供的字体、fontawesome 和另一种自定义字体(在本例中为 ibmplex)。请注意,在提供诸如“ibmplex”和“fontawesome”之类的字体名称时,它们是小写的。为避免混淆为什么字体不起作用,我建议使用小写字母并且名称中不要有空格。
$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'
]);
然后就可以使用了
<span style="font-family: fontawesome;"></span>
根据https://fontawesome.com/cheatsheet -- 请注意 f3ed 是本例中的实际图标。
【讨论】:
像魅力一样工作。我只是省略了所有ibmplex
的东西。我还添加了其他 fontawesome ttfs:['fontawesome' => ['R' => 'fa-regular-400.ttf'], 'fontawesome-solid' => ['R' => 'fa-solid-900.ttf'], 'fontawesome-brands' => ['R' => 'fa-brands-400.ttf']]
在我的 CSS 中,我添加了辅助类:.fa font-family: fontawesome; .fas font-family: fontawesome-solid; .fab font-family: fontawesome-brands;
我认为这是当今最好的解决方案。我用那个注释编辑了我上面的答案。【参考方案3】:
实际上,如果您已经使用 composer 安装了 mPdf,则将以下行添加到位于 vendor\mpdf\mpdf\src\Config\FontVariables.php 的文件中
"fontawesome" => [
'R' => "fontawesome-webfont.ttf",
],
在“字体数据”部分内
【讨论】:
不建议手动修改vendor文件夹中的文件。对于composer安装的人来说最好的解决方案是上面的@Arie解决方案。以上是关于如何在 MPDF 中使用 Font Awesome?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 Laravel 6 中使用 Font Awesome 5 图标
如何在window Form中使用Font Awesome?
如何在 Firefox 中显示 Font Awesome 图标?