How To Add Print And PDF Button For Blogger

Monday 6 August 2012 - ,, No comments
Adding PDF or Print button to blogger is a cool stuff. Your readers can print your webpage or download the PDF of your articles. You may have some busy readers, They can easily download PDF file with one click when they have no time to read the articles surfing your site. They can collect the PDF files and read them offline. You should let your readers to enjoy the chance. You can add print and PDf button to blogger by printfriendly service.









Go to Blogger → Design → Add A Widget → Add A HTML/Javascript Widget



Now paste the Following code in the widget and done


<script src="http://cdn.printfriendly.com/printfriendly.js" type="text/javascript"></script><script type="text/javascript">document.doAT = function(cl){var myclass = new RegExp("hentry");var myTitleContainer = new RegExp("post-title");var myPostContent = new RegExp("post-footer");var elem = this.getElementsByTagName("div");for (var i = 0; i < elem.length; i++){var classes = elem[i].className;if (myclass.test(classes)){var container = elem[i];for (var b = 0; b < container.childNodes.length; b++){var item = container.childNodes[b].className;if (myTitleContainer.test(item)){var link = container.childNodes[b].getElementsByTagName("a");if (typeof(link[0]) != "undefined"){var url = link[0].href;var index_page = true;}else{var url = document.url;var index_page = false;}if (typeof(url) == "undefined"|| url == "undefined" ){url = window.location.href;var index_page = false;}}if (myPostContent.test(item)){var footer = container.childNodes[b];}}var n = document.createElement("div");if (index_page == true) {var at = '<a href=' + url + '?pfstyle=wp' + ' style="float:left; margin-right: 1em; color:#6D9F00; text-decoration:none;" class="printfriendly" title="Printer Friendly and PDF"><img style="border:none;" src="http://cdn.printfriendly.com/pf-button.gif" alt="Print Friendly and PDF"/></a>';}else {var at = '<a href="http://www.printfriendly.com" style="float:left; margin-right: 1em; color:#6D9F00; text-decoration:none;" class="printfriendly" onclick="window.print(); return false;" title="Printer Friendly and PDF"><img style="border:none;" src="http://cdn.printfriendly.com/pf-button.gif" alt="Print Friendly and PDF"/></a>';}n.innerHTML = at;var origFooter = footer.innerHTML;footer.innerHTML = n.innerHTML + origFooter;footer.style.overflow = "hidden";}}return true;};document.doAT("hentry");</script>

You can also change image link

How To Add Print And PDF Button For Blogger 
http://cdn.printfriendly.com/pf-button.gif

How To Add Print And PDF Button For Blogger
http://cdn.printfriendly.com/pf-button-both.gif

How To Add Print And PDF Button For Blogger
http://cdn.printfriendly.com/pf-button-big.gif

How To Add Print And PDF Button For Blogger
http://cdn.printfriendly.com/pf-icon.gif

How To Add Print And PDF Button For Blogger
http://cdn.printfriendly.com/button-print-grnw20.png

How To Add Print And PDF Button For Blogger
http://cdn.printfriendly.com/pf_button_sq_grn_l.png

You will find a cute print or PDF button after every post

How To Add Print And PDF Button For Blogger

Take only 10 second to share the article with your friends if you like



0 comments:

 
Copyright © 2013 AllForMazaPk | About | Privacy | Disclaimer | Advertise | Contact us|