Adding a Google+1 button to a Textpattern Website

In: Google |
06/07/11 |

If you haven’t already heard, Google have recently released their +1 button. The idea is pretty simple and works in a similar way to the ‘like’ button on Facebook. It is a way of letting other Google users know what you think is cool, interesting or helpful.

In order to see +1’s you need to be logged into your Google account, but to be able to +1 websites yourself, you will have to create a public Google profile.

Google+1 button and Textpattern

At WebPraxis, we love the Textpattern CMS system and develop all our sites using it. Installing Google+1 on a Textpattern website is really simple and just requires the addition of the Textpattern permlink tag

First of all, go to the Google +1 website: here you can create a custom +1 button for use on your website. Choose the size of the button and the language you want to display it in.

In the ‘Advanced options’ drop down list you are given the choice to include a count of the number of +1’s received on your article.

In the ‘URL to +1’ textbox, copy and paste the URL of the page you want to add the +1 button to into the box.

Your customised code will now be displayed underneath the settings, copy the first section of the code and paste it at the very bottom of your Textpattern page, just before the end </body> tag. Nothing needs to be changed at this point.

Now, take the second section of the code created on the +1 code generator and place this where you want the +1 button to be displayed.

You need to edit the code as follows, making sure the Textpattern permlink tag is in the right place:

<!-- Place this tag where you want the +1 button to render --> <g:plusone size="medium" count="false" href="<txp:permlink>"></g:plusone>

You can manually change the size of the button (small, medium, tall) and enable/disable the count feature within the code.

If you want to speed up the loading of the Google+1 button you can use the explicit load. The explicit load is 2.9X faster than the default setting with the “tall” button size loading slightly faster than the small and standard buttons.