Chrome Print - Save as PDF - Print to One Page
NOTICE: THIS APPROACH IS SEMI DEPRECATED
Chrome is fairly REALLY impressive with its ability to allow customization in the print section for page sizes.
As such, you can customize your print size. This really saved me when having to print a 32" by 80" web page to pdf.
Here are the directions (remember, we are modifying the front end of the page, so this is a little techy and involves some HTML modification)
- Ctrl + p to open the print dialog
- Click on "More Settings" to expand the lower section
Right Click on the "Paper Size" dropdown and click "Inspect"
(note: this will open chrome's Dev tools)In Dev tools,
<select class="md-select">...</select>will be highlighted, click the arrow next to it to expand that section.- Once expanded, the first option will be:
<option value="{"height_microns":1189000,"name":"ISO_A0","width_microns":841000,"custom_display_name":"A0"}">A0</option> - Right click on that, and then select "Edit as HTML". A text editing section will open up, with the previous option's text all highlighted.
At this point, all you need to do is insert a custom option into this list after the existing one. This means pasting in your own. Unfortunately I cannot build a tool to make the snippet for you to paste as superuser doesn't allow stacksnippets.
There are only a few values you need to modify. I have changed the names to CUSTOM here below.
You will notice that in the text below, there is HHHHHHHHHH and WWWWWWWWWW. These must be manually changed to the micron values associated with your desired dimensions. This website provides a nice free micron calculator: https://www.calculateme.com/length/inches/to-microns/
For my height it was: 80 Inches = 2,032,000 Microns, so for the HHHHHHHHHH I replaced that with 2032000
For my width it was 32 Inches = 812,800 Microns, so for the WWWWWWWWWW I replaced that with 812800
Please find your own associated values and do the same with the below text.
<option value="{"height_microns":HHHHHHHHHH,"name":"ISO_CUSTOM","width_microns":WWWWWWWWWW,"custom_display_name":"CUSTOM"}">CUSTOM</option>
Once that text is ready to go, place it directly after the section in the "Edit as HTML" text editor. Once done, click anywhere outside of the text editing area to cause the changes to render.
At this point, you can click on the dropdown menu, see your CUSTOM option, and select it.
I know this sounds arduous, however, it is really pretty straightforward, and if you are making a pdf from something really custom, it should save you quite a lot of time.
serious updates
At some point, it would appear that the print preview from Google chrome updated to be more test driven. As a result, adding a custom value violates a test condition and nothing happens. This approach no longer works as shown.
The requirement here is to literally intercept the values using the debugger in order to bypass the prevention of the test assertions. Sorry, but that is too in depth to write here. As well, I am concerned that there is a possibility that by publishing a current working fix it will then subsequently be protected against for some reason or another.
Dear Google, if you are indeed looking at these posts, perhaps just allow a custom micron option? It would be greatly appreciated!