How to Add Google +1 to your site
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:
- Include the following JavaScript file in the <head> tag area of the html of your webpage.
- 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.
- 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.
- Alongwith the button, the +1 count can be displayed by adding the attribute count with value equal to true.
| 1 | <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> |
| 1 | <g:plusone></g:plusone> |
| 1 | <g:plusone size=”tall”></g:plusone> |
| 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
| 1 |
]<g:plusone size=”tall” count=”true” href=”http://php.refulz.com”></g:plusone>
|
Else Google tries to read the target URL in two different ways in order of listing:
- The value of the link rel=”canonical” tag explicitly defined in the <head> area.
- The URL of the page as defined in document.location.href. This is the last and least preferred option. So, should be avoided.
| 1 | <link rel="canonical" href="http://php.refulz.com"> |
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
| 1 |
<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.
Versi cetak
Direkomendasikan
Message Me On Whatsapp