How to Add Google +1 to your site

23 October 2011

Google launched enhanced version of its +1 button for search results and publishers.  Two months, since the Google +1 was first heard, Google launched the Google +1 button for website owners to allow the visitors the opportunity to Like or +1 the content of the page.

It was a pleasant surprise to see the Google +1 notification with the code snippet in the Google Adsense account.



The customized script can be generated from the official Google +1 page.



How to Add Google +1


You can add Google +1 to your site in 4 easy steps:


  1. Include the following JavaScript file in the <head> tag area of the html of your webpage.
  2. 1 <script type="text/javascript" src=""></script>
  3. Above script is a must for adding the Google +1 button. Now, you are ready to actually place the +1 button on your page area. The +1 button can be displayed by adding the following shortcode in the suitable page area.
  4. 1 <g:plusone></g:plusone>
  5. The button can be customized with various options like the size attribute which can accept values small, large or tall. By default, the size is standard.
  6. 1 <g:plusone size=”tall”></g:plusone>
  7. Alongwith the button, the +1 count can be displayed by adding the attribute count with value equal to true.


1 <g:plusone size=”tall” count=”true”></g:plusone>


The HTML5 equivalent code of the above code is


1 <div class="g-plusone" data-size="tall" data-count="true"></div>


Adding the +1 Target URL


The most important part in telling Google the URL which is being +1’d is the target attribute. The URL can either be explicitly set as



]<g:plusone size=”tall” count=”true” href=””></g:plusone>


Else Google tries to read the target URL in two different ways in order of listing:


  1. The value of the link rel=”canonical” tag explicitly defined in the <head> area.
  2. 1 <link rel="canonical" href="">
  3. The URL of the page as defined in document.location.href. This is the last and least preferred option. So, should be avoided.


Adding the +1 button in WordPress


As mentioned, adding the script is mandatory to include the Google +1. The button can displayed within a page area by adding the script



<g:plusone size=”tall” count=”true” href="<?php get_permalink(); ?>"></g:plusone>


The noticeable difference is the value for href attribute. The the_permalink() is the WordPress function is display the current page URL.

Multiple +1 buttons can be displayed on one page by defining different values in the href attributes. For complete documentation, please refer the official documentation page.



Sumber : Jasa Pembuatan Website, Siakad, Simpeg dan SIM Rumah Sakit
Selengkapnya :