Have you placed Google +1 button on your blogs and websites? It is pretty simple to show it up, but do you know that Google has updated it to load more fast and work more efficient than before?

The basic Google +1 button requires loading every next time as the URL in the browser windows changes. Many people on web were also experiencing the slow-loading of their websites after using the Google +1 button. Also, people want to use it for a specific URL only. Actually, the button picks the URL of a web page by DOM method (i.e. by window.href client object) by default and allows +1ing for it at the same time. But Google has updated it for good. Here are some important things you should do to boost the Google +1 button on your blogs and websites to load it up fast and make it work more efficiently for individual URLs too.

  • Making Google +1 button 3-times faster: The asynchronous or the JavaScript version of the +1 button loads up 3-times faster than the synchronous one. This is because, it is processed in parallel to the other HTTP requests made while opening a website (as the Google API code page says), but according to me – unlike the basic code (see codes below), the asynchronous version is cached by the web browsers and the script is loaded from the cache only, without loading resources again – hence, making it appear quickly on the page.

    Basic Google +1 button code:

    <g:plusone></g:plusone>
    <script type="javascript" src="https://apis.google.com/js/plusone.js">

    Asynchronous Google +1 button code:

    <script type="text/javascript">
      window.___gcfg = {
        lang: 'en-US'
      };
      (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>

  • Making it work for specific URLs: If you want to make it appear everywhere for a specific URL, you should use the below given code:<g:plusone href="http://techably.com"></g:plusone>Replace http://techably.com with your URL.
  • Making it work with HTML5: The HTML5-valid syntax for the Google +1 button is:<div class="g-plusone" data-size="standard" data-count="true"></div>

This way you can take the most out from Google +1 button. Further, you can read more about the documentation of the +1 button at the official Google API code page. Well, I am using the default version currently. Don’t forget to tell which version is working best for you. Plus ones on this post will be welcomed!.