How to add the Google +1 Button to your WordPress theme
The Google +1 button hit the web earlier today, and I couldn’t resist the opportunity to put it on WordPress. Follow these steps and you can enable Google +1 on WordPress’s default TwentyTen theme:
-
First we need to add the relevant JavaScript to the theme’s header file (by default at /wp-content/themes/twentyten/header.php). Just before the closing </head> tag, add the following:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script> - We then need to adjust loop-single.php so that individual posts will have the +1 button on them. Immediately after the <h1 class=’entry-title’> line (likely on line 26), add the following:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
<g:plusone></g:plusone> - Finally, add the following to loop.php immediately after the final <h1 class=’entry-title’> (likely on line 132), so that posts on the homepage will have +1 buttons:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
<g:plusone href="<?php the_permalink(); ?>"></g:plusone>
And that’s it! Now you’re ready to make good on the Internet’s latest e-validation button.