cpitclaudel / academic-poster-template

An HTML+CSS template for making more accessible posters
https://cpitclaudel.github.io/academic-poster-template/tutorial/poster.html
82 stars 30 forks source link

Generation of A0 PDF #3

Open tzok opened 2 years ago

tzok commented 2 years ago

Is there a way to generate a PDF in A0 format?

Saving a page as a PDF in A0 format does not scale - the PDF is a huge blank page with slides in one column.

tzok commented 2 years ago

I found that you can print the page using a smaller page size and then resize it manually. The example poster from GitHub fits on the A2 page and after resizing it with Inkscape, it looks fine on A0. So this is a workaround, but maybe you know of a better approach?

Anyway, thanks for this great project regarding academic posters!

cpitclaudel commented 2 years ago

(Short answer: type javascript:document.getElementsByTagName("html")[0].style.zoom = 2 in your address bar before printing)

Long answer: Here's what I do (with Chrome):

This works up to size A1, where a scale of 170 does the trick.

For size A0, since Chrome doesn't let me increase "scale" past 200, I add a "zoom" property from CSS, and then printing with "scale" set to 115 fills an A0 page:

html { zoom: 2; }

A convenient way to do this is from the address bar, where you can just type javascript: document.getElementsByTagName("html")[0].style.zoom = 2.

(See the discussion in the comments of https://academia.stackexchange.com/a/173015/24520 for a bit more details)

cpitclaudel commented 2 years ago

I wonder if it would be worth adding this zoom setting to a "media: print" rule in the stylesheet.

tzok commented 2 years ago

Great! Thanks a lot. I will definitely give it a try.

Panadestein commented 2 years ago

Hello @cpitclaudel

Thank you for this very nice project. I was hesitant on whether to open a new issue, because my question is very related to this one. Would it be possible to somehow enforce a two column layout of the poster when printing to PDF? The thing is that some conferences do not accept landscape posters, but only vertical ones.

cpitclaudel commented 2 years ago

@Panadestein I can think of two ways to do this. One is to use a CSS grid instead of a flexbox, and force it to have exactly two columns. The second one is to change the flex-direction of main to row instead of column (to get left-to-right, top-to-bottom layout) and then adjust the scale when printing.

Panadestein commented 2 years ago

Thanks a lot, Clément. The first suggestion worked best for me. I used something in this direction:

grid-template-columns: repeat(auto-fit, minmax(700px, 1fr));

which renders to 2 nice columns when printing to A0 format.

cpitclaudel commented 2 years ago

Great news @Panadestein , thanks for the update! If your poster is public, feel free to add a link here :)