Download Print.css in a .zip file

Not knowing CSS very well and being new to WordPress, I looked all over for a Printer Friendly plugin that would print just the body of the pages in a post or a page on my website. I found a plugin, but I could not get it to work. (I am not experienced enough to know how to edit CSS and PHP very well) . I also found a couple of pre-made CSS files that were to make the posts and pages printer-friendly, but I did not have the right theme or know what they were trying to include, and so it would not print right for me.

In the end, I was able to find a basic CSS tutorial on how to make a printer-friendly CSS file. But, the tutorial was not really made for WordPress. So, back to the drawing board. In the end, I created a printer-friendly CSS file. I had to add a bit of code to the header.php page of the theme to get it to work correctly. This file will not give you an on screen printer preview of what it will print. But, if you goto File / Print Preview in the browser, it will show you what the page will look like before you print it.

This one file may not work for all, but I have included a short how-to to modify it. Basically, if it is showing things you do not want to print, then look in your theme / style.css (For WordPress)  file to see what the name of the ID is. For example, if it is showing the menu blocks on the right and left side of the page, and you do not want to print those, then look in the style.css file and find what they are called. For example, you might find this in your style.css:

#block {
padding: 0 0 0 0;
font-size: 80%;
text-align: justify;
}

So, in the print.css , replace

#right_block {
display: none;
}

with

#block {
display: none;
}

and it will make it so what is defined in the style.css as #block will not display when you print it. You can use this to narrow down the elements on the page you want to be printed.

Also, for WordPress, you need to add the following to your header.php file that is found in your theme folder.

<link rel=”stylesheet” type=”text/css” media=”print” href=”<?php echo get_settings(’siteurl’); ?>/print.css” />

If you are not using WordPress, you still need to put this in the head of the page(s) you want to be printer friendly.

To view it before it prints, open your browser, see if it has File | Printer Preview and click on it, view it and then you can print it.

Unfortunately, my knowledge on CSS and PHP is extremely limited so I will not be able to support this. The best thing I can say is play around with it and try new things. You can always delete the print.css if you get it all out of whack. It might take a few tries to get it just right for what you want to print.

Download Print.css in a .zip file