How—and Why—to Make Your Blog Print-friendly

This guest post is by Dunya Carter.

When crafting your blog, it is easy to neglect how it might look to someone who wants to print your articles and posts.

After all, with huge monitors, smart phones, tablets, and the bevy of other ways people can access your content, who’d want to print it out on a piece of paper like it’s 2004?

Well, it’s the hallmark of a good designer to not assume how someone will want to digest what you have to offer, and it’s so easy to make your blog print-friendly that there is really no reason not to.

You’d be surprised by how many people will choose to print useful articles, especially if they contain some useful information that they would like to refer to when they’re not near a computer.

Printing from scratch

For the code-skittish, there are some special tools and plugins you can use to help get your print-ready blog set up, and we’ll get to those shortly. If you want to customize it exactly how you want—for example, adding a print-only message to the bottom of the page—the best way to do it is coding it yourself with CSS.

Start in the file called header.php in your theme, and look for the line below:

<link rel=”stylesheet” href=”<?php bloginfo(‘stylesheet_url’); ?>” type=”text/css” media=”screen” />

That line tells the browser what style it should use based on the way the user is viewing the page. Most of the time, it will be viewed on a screen. Below that line, add this one:

<link rel=”stylesheet” href=”<?php bloginfo(‘template_directory’); ?>/print.css” type=”text/css” media=”print” />

This directs the browser to use a different stylesheet, called print.css, if the content is being printed. Of course, print.css does not exist yet, so open up your favorite text editor and save a new file called print.css, dropping it into your theme’s directory (the same place you can find your theme’s main stylesheet).

If someone is printing your article, they want just the content of the article. Excessive images that don’t add real value to the content usually wreak havoc on printers and ink supplies, so you’ll want to remove your site’s header, menus, and advertisements (you won’t be making any cash from printed out Internet ads, anyway).

How can you do this? Take a look at your page code, and find the div id of the section you would like to remove (e.g. <div id=”comments”>). Then, simply add the following rule to your print.css file:

#comments {display:none;}

If the code begins with div class (e.g. <div class=”comments”>, the rule should be .comments {display:none;}, not #comments {display:none;}.

The reader wants the article formatted to fit the piece of paper it is being printed on, so scrap any sidebars and footers that might cause unnecessary white space and extra pages.

Finally, remove anything that a reader of a printed sheet cannot use. This includes comment sections (as we’ve just seen), navigation bars, and anything else that requires some sort of user action, like related articles links.

You can test your stylesheet as you modify it using your browser’s print preview function. Just keep removing stuff until it looks like something you’d want to come out of the printer!

Using tools and plugins

WordPress and Blogger are the two most popular blogging platforms, and for those who are not comfortable digging into code and writing a stylesheet themselves, both platforms have plugins that can quickly get you a serviceable print-ready page for every article on your blog.

For WordPress, the easiest option is WP-Print.

A very simple plugin, it gives you a few basic options about how your print page should look, including which links to include, what images should stay in the page, how to handle videos, and an option for a disclaimer.

Your user will simply see a Print button next to your articles exactly where they expect it to. Some other, more complicated tools might offer other functionality, such as printing a page to a PDF, emailing it to friends, or integration with social media like Twitter and Facebook.

If you run a Blogger site, the website printfriendly.com asks you to make a few simple choices, such as the appearance of your Print button and the inclusion or exclusion of features like email and PDF printing. It then gives you a link to download a Blogger widget you can install directly on your site, as well as code you can copy and paste directly where you want the button to show up.

Looking good … in print!

In the end, whatever method you choose, you will have an attractive print-friendly version of every page on your site with only a few minutes’ work.

It might not be the most used feature you ever offer, but for the occasions when a visitor does want to print out something you wrote, they will undoubtedly appreciate that you spent the time to accommodate them.

This article was written by Dunya Carter. Dunya is a marketing consultant from Brisbane, Australia who works for Ink Station, an Australian online ink toner shop. She also writes articles on tech and business for several websites and blogs.