首页 > 解决方案 > Dompdf 未正确显示自定义字体

问题描述

我正在为我的客户构建一个 WordPress 插件,允许用户在购买 WooCommerce 之前定制他们的产品。下订单后,插件会将用户选择保存在订单的元数据中,一切正常。

现在我的客户希望我用从用户那里收到的部分数据构建一个 PDF,我已经使用 domPDF 来实现这一点。现在的问题是我的客户希望我使用自定义字体,但 domPDF 没有正确解码字体。

我已经使用 load_font.php 安装了字体,可以在这里找到

我已经使用这样的命令行安装了一个名为 Smoothie Shoppe 的字体

$ php load_font.php Smoothie-Shoppe ./SmoothieShoppe.ttf并且安装成功。

还像这样在 head 标签中使用 font-family 设置 p 元素的样式

    <style>
        p {
           font-family: Smoothie-Shoppe !important;
           text-align:center;
        }
     </style>

现在,当 PDF 加载时,显示的字体看起来不正确。字母只会变形。

这是它目前的样子

现在的样子

它应该是什么样子

它应该看起来的正确方式

标签: phppdfdompdf

解决方案


我后来自己解决了这个问题。因为该弹出窗口中大约有 15 个 ckeditor 实例,所以它们不会一次全部实例化。

此外,由于我使用 Vuejs 来显示弹出窗口,因此每次显示弹出窗口时,弹出窗口都会重建其中的所有内容。所以我必须向所有输入添加事件,然后在每个文本区域准备好后使用 Typescript 更改每个文本区域的字体系列。

我希望这可以帮助任何发现自己处于我困境中的人。


推荐阅读