Printing with ProseMirror

Hi all, we are doing a Script Editor, based on ProseMirror. We are very happy with ProseMirror so far. We managed to implement:

  • Basic editing
  • Track changes
  • Comments
  • etc…

Now we reached a phase, where we would like to output the content on paper/pdf. Is there a good practice of how to do printing in ProseMirror. We couldn’t find immediately any suggested solution, so please share with us any experience/tools/code you might have in this area… How did you do it yourself? Do we have to use a specific code-snippet? We are in parallel implementing paging, so is paging related to printing as well?

Thank you all!

Greetz, Pavel

Hi Pavel,

We are creating quite a few PDFs through HTML that we create based on the ProseMirror document. We then add specific CSS for PrinceXML to achieve a professional print layout.

Based on my research there are a couple of alternatives, Fiduswriter uses Vivliostyle for instance. And then - of course there still is printing directly from the browser.

This really depends on what your requirements are, I’d probably start with a simple @media print CSS style and see how far the browser takes you. This could even work right out of ProseMirror without any additions.

Best Frederik

Hi Frederik,

thanks a lot! Your input helped us. We saw PrinceXML and we liked its set of features and scale. We will be using Pages in our ProseMirror node structure. That means, that for us, it will be very important, that what is visible as a page in the browser, should appear exactly as 1 page in the PDF printed out. Do you know whether PrinceXML supports that (so something like FIT-IN-PAGE functionality)?

Greetz, Pavel

You could probably add manual page breaks after each of your calculated pages with CSS or even use named pages.

It is probably a good idea to head over to their forum with the DOM you have in mind to figure out how to do that exactly. I don’t see an easy solution in the case that the content you want to have on one page is larger than a page.

If you come up with a neat solution for dynamic content, I’d a appreciate a ping back since that might be useful for other ProseMirror users as well. Especially how you restrict the content length within ProseMirror so it fits onto one page.

Best Frederik

p.s.: Please be aware that PrinceXMLs JavaScript engine is quite far behind in terms of features. Their CSS support for paged media ist great though. There is another alternative PDFreactor with a lot better documentation. We chose not to use it because of features regarding figure placement and other things important for scholarly articles. It might be a good fit for you as well though.