Why the generated pdf doesn’t is not CSS styled?

I have a view welcome.blade.php with the headear like this:

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>Blog</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="{{ asset('css/app.css') }}" rel="stylesheet" media="print">
    <link href="{{ asset('css/example.css') }}" rel="stylesheet" media="print">
    <link rel="preconnect" href="https://fonts.gstatic.com">
</head>

<body class="font-sans antialiased w-full">

....

I’m using tailwindcss, this page has a responsive layout with many colors, svgs, etc. And it’s working fine, however I’m trying to generate a pdf of this page with barryvdh/laravel-dompdf. But when the pdf is downloaded it doesn’t have any style, no colors, it has a serif font, and the layout is all unorganized.

Route for the pdf functionality:

Route::get('/', [PDFController::class, 'generatePDF']);

PDFController:
use IlluminateHttpRequest;
use PDF;

class PDFController extends Controller
{
    public function generatePDF()
    {
        $data = [
          'title' => 'PDF Title',
          'author' => 'Author'
        ];

        $pdf = PDF::loadView('welcome', $data);
        return $pdf->download('test.pdf');
    }
}

Do you know what can be the issue?

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

The style and view are not automatically inherited, domPdf needs to be fed a specific view and css in order to work properly.

Have a look here:

How to include the external style sheet in dom pdf

and this is a very detailed guide on how to achieve that:

https://www.positronx.io/laravel-pdf-tutorial-generate-pdf-with-dompdf-in-laravel/


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x