Make Blog Pages Printer Friendly

Make Blog Pages Printer FriendlyNormally when you print you blog pages using a printer you will find an awful print. The printer may show un revalent printings.

Thinking it as the mistake of printer is a wrong idea as it has nothing to do with that awful print. The un-necessary stuffs such as ads where appearing and the necessary stuffs were disappeared.

But this problem is not solved, as today we shall be making our blog pages (posts/static pages) printer friendly. We can remove those un-necessary stuffs easily. So, to do it follow below steps;

Adding CSS Code;

We will need to add CSS code to our blog to make it printer friendly. Follow below steps;
  • Go to blogger dashboard>Template>Edit Html.
  • Find <b:include data='blog' name='all-head-content'/> in your template code.
  • Then add the below code just after it;
<style media='print' type='text/css'> #header-wrapper, #header, .header, #sidebar-wrapper, .sidebar, #lower-wrapper, #footer-wrapper, #footer, #credit, .comment-form, .post-footer, #blog-pager, .post-feeds, #backlinks-container, #navbar-section, footer {display: none;} #content-wrapper, #main-wrapper, #main { width: auto !important; overflow: visible !important; float: none !important; color: black; font-size: 12pt; background: white; border: none; } #main a { text-decoration: underline; color: blue; } </style> 
  • I have only added some sections to be excluded. If you want to exclude more sections, if you have any then add them just after "footer" in line 4.
  • Click on save template.

Adding Print Button;

Your blog is already printer friendly. But what if you need to add a print button on your page. If so follow below;
  • Copy the below code;
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a href="javascript:window.print()"><img border="0" style="margin-right:5px" src="YourImageUrl"/>Print this article</a>
</b:if>
  • In the above code replace "YourImageUrl" with the direct link to your print icon which would appear as a print button
  • After you copied above code paste it where ever you wish, the print button to appear.
I hope this trick worked for you.
Bye Pals!

Share this

Related Posts

Previous
Next Post »

7 comments

comments
Anonymous
February 8, 2013 at 8:00 AM delete

"un revalent"? I assume you mean "irrelevant"...?

Reply
avatar
February 8, 2013 at 7:05 PM delete

@Anonymous
I mean so. Thanks for your suggestion..

Reply
avatar
Anonymous
April 22, 2013 at 12:37 AM delete

Every weekend i used to pay a quick visit this web page, for the reason that i wish
for enjoyment, for the reason that this this web site conations really
pleasant funny information too.

Here is my blog; waist hip ratio

Reply
avatar
Anonymous
April 22, 2013 at 4:30 AM delete

What's up everybody, here every one is sharing such experience, therefore it's
nice to read this webpage, and I used to go to see this
weblog all the time.

Also visit my web-site laser printer

Reply
avatar
Anonymous
April 22, 2013 at 6:21 AM delete

I am extremely impressed along with your writing abilities and also with the structure for your blog.
Is that this a paid topic or did you customize it your self?
Anyway stay up the nice high quality writing, it is rare to peer a nice blog like this one
today..

my web-site ... seagate hard drive review

Reply
avatar
April 22, 2013 at 10:25 PM delete

Your blog is useful blog for printing.

For Expert HP Printer Support Solution

Reply
avatar
April 29, 2013 at 6:02 AM delete

This is all about relavent to printings

Reply
avatar