TutorialWebForBlogger

TW4B It's about a blog that talking about blogging widgets, blogger template tutorials, search engine optimization SEO and other useful blogging tips

Let's review a topic about how to add print this post button on your blog. It's really necessary to Add Print Button to Blogger Post... nopict

How to Add Print This Post Button in Blogger

Let's review a topic about how to add print this post button on your blog. It's really necessary to Add Print Button to Blogger Posts, if there were any visitors or viewers want to print one or more posts in a blog.

Like this below :

Click Here to See the Example

How to add print button to blogger posts ?

First Step

1. Go to Dashboard, click Design, click Edit HTML

2. Click Expand Widget Templates

3. Find code of HTML below :

</head>

you can use (Ctrl+F) to find easily

4. Right before </head> place code of HTML below :

<style media='print' type='text/css'>#header-wrapper, #header, .header, #sidebar-wrapper, .sidebar, #footer-wrapper, #footer, .date-header, .post-meta-data, .comment-link, .comment-footer, #blog-pager, #backlinks-container, #navbar-section, .subscribe_notice, .noprint {display: none;}#main-wrapper {width: 100%}</style>


Second Step

1. Find code of HTML below :

<data:post.body/>

you can use (Ctrl+F) to find easily

2. Right after <data:post.body/> place code of HTML below :

<!--Print-Button-BEGIN-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><a href='javascript:window.print()' style='text-decoration:none;' target='_blank'><img src='http://www.iconarchive.com/icons/artua/dragon-soft/24/Printer-icon.png' style='margin-bottom:-12px; cursor: pointer; border:none;-moz-box-shadow: none;-webkit-box-shadow:none;box-shadow:none;'/><span style='color:#1A67B8; font: normal bold 15px Arial.Helvetica,sans-serif; letter-spacing: 0.85px;'><i>Print This Post</i></span></a></b:if>
<!--Print-Button-END-http://tutorialwebforblogger.blogspot.com-->

NOTES :
you can change word-phrase Print This Post into other word-phrase, such as Click to Print or, anything you like.

3. Click save template and done.

Now you've already added print button in the bottom of your blogger posts.

There are no comments yet for 'How to Add Print This Post Button in Blogger'