Big Picture Web

View Original

Speed Up Your Google +1 Button on Squarespace

Upgrade Google +1 buttonA few months ago Google rolled out the ability to add the Google +1 button to your blog as a part of their new social media strategy. In the time since, they updated the Google +1 button code to make it load 3x faster. No one wants slow code on their site, so today we look at how to upgrade the Google +1 button code on your Squarespace site.

Installing the Google +1 Button on Squarespace

I wrote a post on installing the Google +1 button on Squarespace within a week of the button launching. If you don't have it on your site yet, go there to learn how to add the code to your site, as I've revised it to reflect the new process.

Read on if you installed the Google +1 button code on your site between June 1 and today. We'll walk through how to make the upgrade from the slow code to the fast code.

Upgrading the Google +1 Button on Squarespace

Speeding up the Google + button is a simple process that involves removing some of the old code from your website header and putting some new code into your website footer. Let's get started.

First, access your Website Management menu and then your Website Settings. Then select Code Injection.

Squarespace website settings

Look for the Google +1 button code snippet highlighted in the screenshot below and delete it from your Code Injection area. Save the changes to your site.

Old Google +1 button head snippet

Next up, switch over to Structure Editing mode on your site.

Squarespace Structure Editing mode

Scroll down to the bottom of your website and enter select the edit website footer option.

Squarespace edit website footer

Copy and paste the following code into your website footer and save your changes. That's all there is to the process. Enjoy the 3x faster Google +1 button!
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

<!--  Place this tag after the last plusone tag --><script type="text/javascript">  (function() {    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;    po.src = 'https://apis.google.com/js/plusone.js';    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);  })();</script>