Kirby to PDF for print?

Continuing the discussion from Kirby + PrinceXML?:

I continue to believe Kirby would be a nice framework to prepare documents for print.
There is an interesting explanation of how they do CSS templating for print :

Anyone interested in trying it out with me?

I always use the “industry standard” http://www.tcpdf.org/

An open-source PDF creator, from online source-files.

Using this library, you can build your own PDF-factory / implementation.

The site looks outdated, but the quality and options for creating PDF from html / css / database / etc… is really outstanding.

You can also easily wrap the library with a dynamic site, like a plug-in (Wordpress, but you can convert it to Kirby).

1 Like

Except when using PrinceXML or PhantomJS (does not support the awesome CSS printing features though), printing a HTML page to a PDF from PHP won’t give really good results. TCPDF creates crazy large files when using the HTML mode.

Creating a PDF from PHP powered codes gives (me) extreme good and small results.

I even use them to create official PDF-X documents for pre-press purposes, where I convert (s)RGB-colorspace to CMYK - with a nice Adobe converter.

But I do not “simply” convert “a” page to PDF -> I parse the code with Simple DOM, extract what I need, place a custom CSS on the content and spit out a decent PDF.

So, it’s possible - I use it for clients who create a page with high-res images on the fly (using a custom CMS) and they create the PDF-X in order to have it printed (booklets, cards, posters, etc).

1 Like

Thanks @1n3JgKl9pQ6cUMrW and @lukasbestle
I’ve been toying around the idea for a while and I’m trying to figure out the best way to do this.
I think it’s a bit beyond my coding capabilities at the moment, but I’ll try and dig into it!

Hi guys,
Did one of you suceed to have a “Print this page in PDF” button in Kirby?
I want to generate a PDF from a Kirby page, using a “print.css” stylesheet.
Any idea?

i have done something like that in the past using mpdf

here is a guide:

https://daveismyname.com/generate-a-pdf-from-a-web-page-bp

it’s not my guide, however similar to this, i’ve also been able to print my pages as a whole without too much hassle.

Thanks! Do you have a live example on Kirby?

unfortunatly nothing to show off right now.

We built the Coffee Variety Catalog this Summer, and uses print stylesheets extensively.

The PDFs you download here were all “generated” by an administrator by using the standard “Print” dialog in Chrome.

While it doesn’t auto-generate the PDF, there isn’t really much need, given that an editor will be publishing them at particular intervals (and users will only download a particular release), rather than an up-to-date-and-on-the-fly version.

We created a separate “release” template that threaded together content from throughout the site into a single page (which was backed by a blueprint that allowed a bunch of customizations and additional content to be added.

During development, we made extensive use of Chrome’s “Emulate CSS Media” setting (see below).

We hope to open-source this project soon, but will need sign-off from the organization. :wink:

Thanks for the example! What I want to achieve is simplier : I just want to print single pages (ex.: a blog post), and not generate a PDF from several pages combined. The PDF is the content of the page, with a layout generated from a stylesheet “styles.css”. If someone has time to make a plugin, I think it can be helpfull for many people!

In the end, I used Prince XML to generate the PDF by hand. It was for a pretty long doc (~60 pages) with content table, page numbers, footnotes and all.
Then ran it through the ‘print PDF’ command on Chrome to take off the watermark. Worked really well but it’s still not ‘automatic’…

I don’t think you need a plugin for this. You can make your print stylesheet apply to print using the media directive in the <link> tag and then add a print button to the page (window.print()). It’s a bit of manual work, but definitely the easiest way to print single pages to PDF.

1 Like

The example was just to demonstrate the flexibility of print-specific stylesheets.

For many elements, it’s as simple as turning them on or off:

@media print {
  nav {
    display: none;
  }
}

If you’re making lots of adjustments, Sass or SCSS mixins are your friend:

=print
  @media print
    @content

// ...later, or in another stylesheet

.page-title
  +print
    text-align: center

You can change just about any CSS property within a @media declaration.

Check out the MDN article on @media directives.

I don’t think there’s anything about your application that would require a plugin— it’s just making use of the available tools in a smart way.

Thank you! I know how to work with a print stylesheet, but the problem with the “window.print” javascript button is that it open a print window instead of generate a downloadable PDF…

I had some good experience with wkhtmltopdf. It is a command line tool that converts any domain into a pdf.

Shopkit uses DOMPdf to generate invoices, maybe you can find some reusable code there.

That’s definitely true. I had a similar use-case before and simply “printing to PDF” was a good solution there (some operating systems like macOS support that by default). Of course that’s not always viable.
Much more complex but doable is using some kind of PHP PDF library like proposed above.

I used TCPDF and its a nightmare. Its fine for things like tickets and one pagers - where you generate the elements directly without HTML conversion. HTML mode is extremely slow and just horrible. mPDF was better similar PHP library. Because TCPDF in html mode sometimes silently errors for strange reasons and does nothing (hard to debug). With mPDF you have some kind of security that the libary generates at least some PDF file or error output.

In the end its not worth it i think. Use print styles where you can.

If you end up going the PHP generator HTML route - be sure to feed it valid html (run it through php tidy or something like that).

Hi,
without reading the whole thread, last week I found that libary to generate PDDF through Javascript:

I don’t know if this work proper but I thought I throw it here between. Perhaps it can help someone :slight_smile:.