Saturday, June 19, 2010

How to Put the Print Friendly Button On Top of WordPress Posts

UPDATE: This feature is now built into the WordPress Plugin. Simply install the Printer Friendly & PDF plugin, activate, and click settings. You'll see a option to position the button on the Left, Right, Top, Bottom of your posts.

Lots of people ask me how to they can move the Print Friendly button from the bottom of their WordPress page, to the top. Or, they want to align it to the right or center.

The default location for the PrintFriendly button is at the bottom of the post, aligned to the left. However, if you'd like to change the location, here's some simple steps. If you need additional help, email me at "support [at]".

To get started, you'll need to get the Print Button Plugin for WordPress.

Step 1: Which Button Are You Using?

The first step is simple. Simply identify the button you are using.
  • pf-button 
  • pf-button-both 
  • pf-icon-small 
  • pf-icon-both 
  • pf-button-big 
  • pf-icon.gif 

Step 2: Modify "pf.php" file

When you download and expand file, open the file named "pf.php". Starting on line 27, you will see several statements starting with the word "case ".

Find the case for the button you are using. For example, if you are using "pf-button-both", you'll want to find and modify the case "pf-button-both.gif":

Within the "case" statment for your button, you'll find "div id=pfbutton". To change the alignment of the PF button, add some styles to this div.

>Align Right or Left: Add "style="float:right;" OR "style="float:left;"

Align center: Add "style="text-align: center;"

Put the Print Friendly Button on the Top of Your Post

Within the "case" statement for your button, you'll find a "return $content". Move $content to the end of the statement. For Example, Change this:

To This:

Careful: When you change $content make sure you put the period "." at the front, ".$content;"

If you have any questions, feedback, or need some help, email me at support [at]