Remark: Print to PDF in Chrome drops background images

Created on 17 Feb 2014 · 11Comments · Source: gnab/remark

I tried saving to PDF using print in Chrome. Works great, except it leaves out background images. Any way to change this?

An example slide is here: http://thomasleeper.com/regcourse/Slides/Session03_01.html#35

Source

leeper

Most helpful comment

You can use this trick to workaround that issue:

http://www.richardnichols.net/2012/08/getting-chrome-to-print-with-background-colors-enabled/

I tried it replacing

<body>

<body style="-webkit-print-color-adjust:exact;">

in the remark source file and it worked for me.

kupiqu on 22 Feb 2014

👍20 ❤11 🎉7

All 11 comments

You can use this trick to workaround that issue:

http://www.richardnichols.net/2012/08/getting-chrome-to-print-with-background-colors-enabled/

I tried it replacing

<body>

<body style="-webkit-print-color-adjust:exact;">

in the remark source file and it worked for me.

kupiqu on 22 Feb 2014

👍20 ❤11 🎉7

@leeper Did you get this to work as well? If so, the examples should be updated.

gnab on 26 Feb 2014

I think this is by default supported in chrome. There is an option when you print

from iPhone

On Feb 26, 2014, at 13:00, Ole Petter Bang [email protected] wrote:

@leeper Did you get this to work as well? If so, the examples should be updated.

—
Reply to this email directly or view it on GitHub.

pinggit on 26 Feb 2014

Yes, I am assuming this isn't just not having checked the print option @pinggit is mentioning?

Screenshot:

Print option

gnab on 26 Feb 2014

I don't have those options in my chromium printing menu

kupiqu on 26 Feb 2014

@kupiqu That's a Google Chrome only feature, alas not available in Chromium.

kynan on 26 Feb 2014

Ok, but then there is an alternative way to achieve the same also in Chromium, by using my trick above ;)

kupiqu on 26 Feb 2014

Oh, my, yes, just clicking the "background colors and images" box does the trick. But, I tried out the solution suggested by @kupiqu and that worked as well. So if the checkbox is only available in Chrome, maybe best to update the examples.

leeper on 27 Feb 2014

I've now added the -webkit-print-color-adjust:exact; CSS to the styles applied to the body element by remark, making the background color/image always be included when printing. It actually cannot be disabled using the checkbox in Chrome, so we'll just have to wait for someone to request being able to omit background color/image when printing... ;)

The change is available in the master branch build, and will go in the next release of remark.

gnab on 2 Mar 2014

hey, great!

kupiqu on 2 Mar 2014

Can somebody do it with firefox ? the display is awful.