Add CSS to DomPDF

Question

I've got this code to export some data into a pdf. And I would like to add css from an external css file (which is not mentionned in the html used)

/*********************************** Export PDF ****************************************************/
if($request->query->get('exportPDF')!= null){
    // Configure Dompdf according to your needs
    $pdfOptions = new Options();
    $pdfOptions->set('defaultFont', 'Arial');
    // Instantiate Dompdf with our options
    $dompdf = new Dompdf($pdfOptions);
    // Retrieve the HTML generated in our twig file
    $html = $this->renderView('dashboard/user_table.html.twig', [
        'users' => $users
    ]);
    // Load HTML to Dompdf
    $dompdf->loadHtml($html);
    // (Optional) Setup the paper size and orientation 'portrait' or 'portrait'
    $dompdf->setPaper('A3', 'landscape');
    // Render the HTML as PDF
    $dompdf->render();
    // Output the generated PDF to Browser (force download)
    $dompdf->stream("exportUsers.pdf", [
        "Attachment" => true
    ]);
}

The user_table.html is only a file with a <table>

who has some class from a css file loaded in an other template. That means for DomPDF the file who contains the css is unkown and, as a result I have a table with no css in my pdf. I've tried to add the stylesheet in my html directly but the import isn't working like that neither. But I don't want to add it in the html anyway, the css is loaded is a more hight level template.

How to add external files (like bootstrap etc etc) from this structure ? I do not know if this is even possible. Thanks for the help ;)

Possible duplicate of [How to include the external style sheet in dom pdf](https://stackoverflow.com/questions/19805148/how-to-include-the-external-style-sheet-in-dom-pdf) — toh19, Feb 12 '19 at 16:00
@TOH19 it's not there is not answer provided + the man says: Your CSS should be part of the HTML you feed to dompdf. I don't want this, my css is already elsewhere. — Minirock, Feb 12 '19 at 16:02
_The user_table.html is only a file with a _ => you mean there is no reference to the css you want to include in the html you give to dompdf ? how is it supposed to guess which file you want to include ? — ᴄʀᴏᴢᴇᴛ, Feb 12 '19 at 16:17
@ᴄʀᴏᴢᴇᴛ It's not, they are loading the CSS inside the html...as I said, I'm not. The user templates know it because the templates is loaded from an other page. But as you notice...for the dom pdf...there is no reference to the css file. So here is the question, how to add it, without adding it to the html file. I don't know. — Minirock, Feb 12 '19 at 16:18

ᴄʀᴏᴢᴇᴛ · Accepted Answer · 2019-02-18T09:28:33.217

8

the css file must be referenced in the HTML you give to DomPDF.

If you don't want to change your twig template, you can use a workaround like this :

$dompdf = new Dompdf();
$html = $this->renderView('dashboard/user_table.html.twig', [
    'users' => $users
]);
$html .= '<link type="text/css" href="/absolute/path/to/pdf.css" rel="stylesheet" />';
$dompdf->loadHtml($html);

Note that adding a link tag to the body is not valid according to HTML specifications. With the current Dompdf version, it works but it may not work in future versions.

edited Feb 18 '19 at 09:28

answered Feb 12 '19 at 16:39

ᴄʀᴏᴢᴇᴛ

2,939
26
44

1

Keep in mind it's possible browsers could "fix" the incorrectly placed LINK element by moving it into the head. I'd still use a link element, but you can add a media attribute with the "dompdf" media type to target dompdf, e.g. ``. – BrianS Feb 16 '19 at 21:37

score 2 · Answer 2 · answered Feb 12 '19 at 16:10

2

You can always use solutions like this Including a non-twig file from twig read external file contents right into templates attribute, so css will be rendered inline and will be compatible with mpdf.

answered Feb 12 '19 at 16:10

Vytenis Ščiukas

473
2
9

Not sure I understand what you mean here. – Minirock Feb 12 '19 at 16:17
2

Try to render external file content straight into your html content that you pass into dompdf. – Vytenis Ščiukas Feb 12 '19 at 16:18

Add CSS to DomPDF

2 Answers2