StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>In case someone is looking for this answer in the future, I will complete this with my solutions. Based on the lack of answers, I guess there really is no way to create a PDF with multiple page orientations using wkhtmltopdf.</p> <ol> <li><p>The first solution I implemented was creating a single PDF using one HTML file and rotating the content of the landscape page using the following CSS:</p> <pre><code>width: 1275px; height: 1650px; -webkit-transform: translateY(1650px) rotate(270deg); /* Chrome, Safari 3.1+ */ -moz-transform: translateY(1650px) rotate(270deg); /* Firefox 3.5+ */ -o-transform: translateY(1650px) rotate(270deg); /* Opera 10.5-12.0 */ -ms-transform: translateY(1650px) rotate(270deg); /* IE 9 */ transform: translateY(1650px) rotate(270deg); /* IE 10+, Firefox 16.0+, Opera 12.1+ */ filter: progid:DXImageTransform.Microsoft.Matrix(M11=6.123031769111886e-17, M12=1, M21=-1, M22=6.123031769111886e-17, SizingMethod='auto expand'); /* IE 6-7 */ -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=6.123031769111886e-17, M12=1, M21=-1, M22=6.123031769111886e-17, SizingMethod='auto expand')"; /* IE 8 */ -webkit-transform-origin: 0% 0%; -moz-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; </code></pre> <p>(To write similar compatible CSS3 transforms, check out this great site to calculate all of the IE matrix values: <a href="http://www.useragentman.com/IETransformsTranslator/" rel="noreferrer">http://www.useragentman.com/IETransformsTranslator/</a>)</p> <p>This would be a decent solution if your users would only be printing the PDF after it was produced. Since my users need to view the PDF on screen, it would not be practical for them to have to rotate the page using their PDF viewing software. </p></li> <li><p>So, my second solution was to create each page as a separate PDF from individual HTML files, and then I used <a href="http://www.ghostscript.com/download/gsdnld.html" rel="noreferrer">Ghostscript</a> to merge them into a single file. This worked perfectly, but just added some extra processing time to create all of the files and merge them. In my case, the PDF would not be downloaded too often and the number of pages was minimal so the extra time was not a significant burden. </p></li> </ol>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload