II How To Add Official Google+ II Badge/Widget To Blogger/Blogs II

Image result for Google+ badges as page

Google+ is officially provided you badges for your profile, pages or communities that you can add into your websites or blogs. The easiest and smarter way to grow your community is to add Google plus widget to your blogs. Users may add your official Google plus page to their circles, and would give you a thumb up as +1 to your blog. You can see my Google+ page badge in the right sidebar area, you may add my page to your circles, and I appreciate if you +1 it. They also would be able to give a thumb up to your blog via the +1 button. I have also added a Google+ profile page below to this article, please add me in your circle. Therefore, here is a quick guide to add Google+ badges as page, community or profile to blogs.

Make sure, if you are using badge for your community pages, you are selected the correct URL. For example, my community page URL is hhttps://plus.google.com/u/0/1141329245376126097773. If you have pasted the correct URL, you will see the preview in the right side. to select the correct Google+ page URL. For example, my page URL is https://plus.google.com/u/0/100086246339880387720/posts. You will also see the code snippet below to your preview that you to paste it into your blogs.



One is, <!-- Place this tag where you want the badge to render. --> 
Second is, <!-- Place this tag after the last badge tag. -->

Now, copy the Second Part as shown in the preview, and sign in to Your Blogger Dashboard--> Choose you blog --> Template --> Edit HTML find the code (using ctrl+F) </head>, and paste the Second Part just above </head>.

Now, copy the First Part and paste this tag where you want to show your Google+ Badge. For example,

Image result for Delicious SnacksIn Sidebar: paste First Part code into your sidebar widgets by going to Blogger Dashboard --> Layout --> Add a Gadget(choose from sidebars) --> HTML/JavaScript (Choose under pop up window) and paste your code and click on Save.

In Content Above/Below: Sign in to Your Blogger Dashboard --> Template --> Edit HTMLfind the code (using ctrl+F) <data:post.body/>, and paste First Part code just before <data:post.body/> code to display on above the content area. If you want to show it below to content area, paste First Part code to below <data:post.body/>, and finally click on Save. If you are using read more hack on your Blogger blog, you would see <data:post.body/> code two times in your blog, so try for each and look at your blog to find out which is suitable for you.

No comments

Please do not enter any link in the comment box.

Powered by Blogger.