Why do images blow up to full page width when printing a post?

Jeremy White
asked 10 years ago

I’ve had someone ask me about printing out pages from my site theredshtick.com. Every images in the post blows up to the full width of the page, thus increasing the size of the print job by several pages, not to mention they look horrible. Is there anything I can do to keep the images scaled so that they print out in the same proportion as they appear on the screen, or even remove all images from the printable version?

2 Answers

Wilfred
answered 10 years ago

Hi Jeremy,
To resolve this issue please add the following code to custom wp_head in Dashboard / Appearance / Customize / Custom code

   <style>
@media print {
 .single .site-content>.hentry .entry-thumbnail {
 margin-bottom: 10px;
 }
 .hentry .alignleft, .hentry .alignright {
 width: auto !important; 
 }
 .hentry .alignleft {
 float: left !important;
 margin-right: 20px !important;
 }
 .hentry .alignright {
 float: right !important;
 margin-left: 20px !important;
 }
}
</style>

Hope this helps !

Jeremy White
replied 10 years ago

Better. The images are still rather large (medium-scaled image on one post takes up 3/4 of the width of a sheet), but at least the text wraps around them.

Thanks!

Wilfred
answered 10 years ago

If your images are still rather large, let’s add the following code to wp_head in Dashboard / Appearance / Customize / Custom code in order to limit the maximum size of the images.

 <style>
@media print {
.single .entry-content img {
max-width: 500px;
}
}
</style>