How to Add Google+ Add to Circle Gadget in Blogspot

Monday, 27 August 2012

How to Add Google+ Add to Circle Gadget in Blogspot

Social Media Sites are very popular now a days and the importance of these sites are increasing day by day. Specially the social media networks are very helpful to increase the traffic of sites or blogs. Google + is also getting popularity now a days. So i will tell you that how you can add the Gadget of g+ Add to circles to your blog.

1- Go to Your Blogger Design option and click Add a Gadget.

2- Select HTML/JavaScript option and paste the following code

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

<br />
<div style="background: url(Background-Image);
            border-radius: 3px;
            border: 4px solid #CCC;
            margin: 0px; padding: 10px 10px 5px 10px;
            width: 290px;">
<b><span style="color: #333333;
    font-family: arial;
    font-size: 14px;">
Muhammad Faheem Usama In <a href="https://plus.google.com/107002605838587470279/posts">0</a> Circles →</span></b><br />
<div>
<b><br /></b>

<b><img align="left" alt="Muhammad Faheem Usama" height="54px" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2hvvQ87I0pHFIAHgXOsHI4uKXxBByHaQ5gT357V9eQvGKW3ono-PoXRlEm5YiTEvasEFK_ebCT2un42QaPsR_2IYFayB-zNbUUWiO7HGShrsts3LGBqi_l4Xnt89nqIXda6WrtKfi6x0_/s1600/faheem.jpg" style="margin-right: 5px;" />

<script type="text/javascript">
window.___gcfg = {lang: 'en'};
(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>
<g:plus height="69" href="https://plus.google.com/107002605838587470279/posts" rel="author" width="210"></g:plus></b></div>
</div>

Replace https://plus.google.com/107002605838587470279/posts with your own Google + URL.
Change your own name instead of Muhammad Faheem Usama
You can put any background image or keep Background-Image same if you want white background.
0 is the number of people who are in circle of you.
Add your picture URL instead of https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2hvvQ87I0pHFIAHgXOsHI4uKXxBByHaQ5gT357V9eQvGKW3ono-PoXRlEm5YiTEvasEFK_ebCT2un42QaPsR_2IYFayB-zNbUUWiO7HGShrsts3LGBqi_l4Xnt89nqIXda6WrtKfi6x0_/s1600/faheem.jpg

3- Save the Gadget and all is done.