How can I set a zoom level on a headless chrome instance?

user_1058739 0
Viewed 2181

I'd like to mimic the user zooming out to 80% when viewing my webpage. Something along the lines of 

`google-chrome --headless --disable-gpu --screenshot --zoom=0.8 --window-size=1920,1080 http://www.example.com/`

But the "zoom" property doesn't exist, and I can't find anything in this list that looks comparable:

https://peter.sh/experiments/chromium-command-line-switches/

This must be a fairly common thing for people to want to do, so I feel I must be missing something simple...

google-chrome-headless
2 Answers

You don't need to use a chrome headless feature for that - chrome will render your css as long as you have the zooming in there. This is the css I used: 

@media print{
    @page { margin: 2%; size: A4 }
     body { margin: 1.6cm; zoom: .7;}
     footer {
        position: fixed;
        bottom: 1;
     }
     header {
        position: fixed;
        top: 1;
     }
  }

NOTE the zoom: .7 in the body ... to issue the following chrome headless call : 

chrome --headless --disable-gpu --print-to-pdf \
    'https://qto.fi:442/qto/view/installations_doc?&bid=0&as=print-doc'

Bonus: If you want custom header and footer with some logos etc. just add the header and footer tags: 

 <header><p>header</p></header>
 <footer><p>footer</p></footer>
YordanGeorgiev_657060

Adding back this answer that was deleted but is what I was looking for.

--force-device-scale-factor=1.5

This will set a scale factor on the headless instance when you get the screenshot. Suppose you want a 500px by 500px image of a 1000px by 1000px web page. Then use:

google-chrome --headless --force-device-scale-factor=0.5 --window-size=1000,1000 --screenshot=out.png https://mywebsite.com
user_159470
Related