如何在DomPDF中安装自定义字体

Question

Good day all.

Im using WordPress and DomPDF to create a simple posts to pdf to email function.

The PDF generation and email function is working fine however, I dont seem to be able to get a custom font working at all.

Ive downloaded the .ttf file from Google (Muli-Regular.ttf) and am trying to add it in as follows:

<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>">
<style type="text/css">  
    @font-face{
        font-family: 'Muli';
        src:'<?php echo get_template_directory(); ?>/dompdf/lib/fonts/Muli.ttf';
    }      
    h1,h2,h3,h4,h5 {
        font-family: 'Muli', sans-serif;
    }
    h1.title{ color: #6c9bcb !important}
    p, a{font-size: 16px;font-family: 'Muli', sans-serif;}
    footer a{color: #333;}     
</style>

Needless to say, the PDF is not loading the font.

Any help would be greatly appreciated.

Answer 1

Your @font-face declaration doesn't conform to the CSS spec. The main issue is the src property, the path isn't wrapped in the url function. Also, dompdf can be a bit finicky so best to be as explicit as possible. Try this:

@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: normal;
  src: url('<?php echo get_template_directory(); ?>/dompdf/lib/fonts/Muli.ttf') format('truetype');
}