Description: Simple tutorial to add Google+ or +1 Button to Blogger Posts. When someone +1's your post, it would be a Google+ recommendation for their Google connections.
You would be familiar with Google+ button, if you are a Blogger. Have you created a new blog on Blogger platform? If yes, you don't need to search for adding Google +1 button to your blog. You can add plus one button by going to 'Layout -> Add a Gadget -> +1 Button' inside your Blogger dashboard. You may also add +1 button to each post inside your Blogger by going to 'Layout -> Blog Posts -> Edit -> Show share buttons -> Save'. You may also add Official Google+ badge to Blogger with your 'Add Gadget' option.
However, if you add your button by the gadget option, you are limited. You can not add your +1 button inside post on different places or header navigation menu, since you don't have the button snippet. If you have a code snippet for a thing, you can add it to your Blogger source code to display the thing anywhere on your blog. We will use Google+ button snippet to display it anywhere on our blog.
Related Articles:
It doesn't mean that the more +1's your post have, the more higher rank getting on the search results. It is basically a recommendation by Google+ connections. You can read more about its SEO advantages to use +1 button which has already been written on Mashable.
Basically your +1's are public. Google will look at your social connections and determine who will get the most benefits from your +1's and which +1's might be useful for you. Your social connections including,
However, if you add your button by the gadget option, you are limited. You can not add your +1 button inside post on different places or header navigation menu, since you don't have the button snippet. If you have a code snippet for a thing, you can add it to your Blogger source code to display the thing anywhere on your blog. We will use Google+ button snippet to display it anywhere on our blog.
Related Articles:
- How to add Facebook Follow Button to Blogger
- How to add Facebook Send Button to Blogger
- How to Embed Facebook Status Updates to Blogger
- How to Embed any Tweet to Blogger
What are SEO Advantages for Google +1 Button?
The more +1's your post received, the more recommendations your post have. Let a user named 'Julia' visit a post on your blog and +1'd this. Now, one of her Google+ connection searches the same topic 'Search Plus Your World' would be activated on the search, and the post +1'd by Julia would be appear to her connections.It doesn't mean that the more +1's your post have, the more higher rank getting on the search results. It is basically a recommendation by Google+ connections. You can read more about its SEO advantages to use +1 button which has already been written on Mashable.
Who Can See My Google +1's Recommendation in the Google Search
Basically your +1's are public. Google will look at your social connections and determine who will get the most benefits from your +1's and which +1's might be useful for you. Your social connections including,
- Users in your Gmail chat list
- Users in your Gtalk chat list
- Users in your My Contacts group in Google Contacts
- Users you are following in Google Reader.
- Users you are following in Google Buzz
*** Viewing +1's by your connections doesn't imply they will also view your +1's.
***You might view +1's from the peoples you don't know (because it doesn't means that their recommendation are not valuable). Similarly, your +1's may be shown by the persons who are outside from your social connections.
Add Google Plus One, +1 Button To Blogger in Every Post Pages
- Go to your Blogger Dashboard --> Select your Blog --> Template --> Edit HTML --> Click anywhere on the source code, press Ctrl + F to find </head> code. Paste the following code above to </head>.
<script src="https://apis.google.com/js/platform.js" async defer></script>
If you have already installed this JavaScript to your blog before, you don't need add this again into your Blogger source code. - Choose any one code of the following code 1.0 that you want to display in your Blogger posts. You may look over the preview of each code into following table.
Code 1.0 Preview <div class="g-plusone"></div> <div class="g-plusone" data-size="small"></div> <div class="g-plusone" data-size="medium"></div> <div class="g-plusone" data-size="tall"></div>
For inline style, you may add additional attribute to the above code data-annotation="inline" and for simple button without counting plus one you may add data-annotation="none". - Once you have chosen your code from code 1.0, display it to your Blogger posts by going to Blogger Dashboard --> Select your Blog --> Template --> Edit HTML --> Click anywhere on the source code, press Ctrl + F to find <data:post.body/> code. Skip the first <data:post.body/> code, since it is used for the mobile template. Once you find <data:post.body/> code second time into your Blogger source code, paste code 1.0 above to <data:post.body/> code for displaying plus one button below to title or paste code 1.0 below to <data:post.body/> code for displaying your Google+ button at the end of your content.
* If you are using automatic read more option for your custom Blogger templates, you might find <data:post.body/> code more than two times so paste your code 1.0 for each one, and look which one is work for you. Once you find out the correct one, save your template.
*You can paste your Code 1.0 anywhere inside your Blogger including your sidebar gadgets.
