At present, social networking
sites have become the most popular hub for people across the globe. Almost every
person has started using social networking sites, and their day seems to be
incomplete without the use of these websites at least once.
So, what can be a better place
than these social networking sites in order to popularise your blog among the
masses worldwide?
Social networking sites are the best option
now for any blogger in the world to share his knowledge, and get a good traffic
in very less time. People have started using these sites as a weapon for their
blogs, to get a great traffic.
And what if all these leading
sites can be added to your blog just by using a single gadget without taking any
pain?
Just follow these simple steps to add this important gadget to your Blogger.
Step 1:- First, go to your Blogger dashboard. Then click on your Blogger Layout option.
 |
| Click to Enlarge |
 |
| Click to Enlarge |
Step 2:- Next, click on Add a Gadget option and scroll your
page down to choose HTML/Javascript Gadget.
 |
| Click to Enlarge |
Step 3:- Now, paste the below code in the content box of your HTML/ Javascript
Gadget.
Step 4:- Replace all these given URL’s with the URL of
the social networking sites that you want among the given names.
----------------------------------!!-------------------------------------------------------!!----------------------------------------
<style>#socialnetworking
{border: 1px solid #ebebeb;
width: 280px;
}
.fb-likebox {
padding: 10px 10px 0 10px;
border-bottom: 1px solid #ebebeb;
}
.googleplus {
background: #eef9fd;
border-top: 1px solid white;
border-bottom: 1px solid #ebebeb;
font-size: 12px;
color: #000;
padding: 9px 11px;
line-height: 1px;
font-family: Verdana, Geneva, sans-serif;
}
.googleplus span {
color: #000;
font-size: 11px;
position: absolute;
margin: 9px 70px;
width: 280px;
}
#widgetbox {
background: #EBEBEB;
padding: 2px 8px 2px 3px;
text-align: right;
border-image: initial;
}
#widgetbox .author-credit a {
font-size: 10px;
font-weight: bold;
text-shadow: 1px 1px white;
color: #1E598E;
text-decoration: none;
}
.g-plusone {
float: left;
}
.twitter {
background: #eef9fd;
border-top: 1px solid #fff;
padding: 10px;
}
.fb {
background: #eef9fd;
border-top: 1px solid white;
border-bottom: 1px solid #ebebeb;
font-size: 12px;
color: #000;
padding: 9px 11px;
line-height: 1px;
font-family: Verdana, Geneva, sans-serif;
}
.fb span {
color: #000;
font-size: 11px;
position: absolute;
margin: -12px 100px;
width: 280px;
}
.pterest {
background: #EFF5FB;
border-bottom: 1px solid #ebebeb;
font-size: 12px;
color: #000;
padding: 9px 11px;
line-height: 1px;
font-family: Verdana, Geneva, sans-serif;
border-top: 1px solid #ddd;
}
#email-news-subscribe .email-box
{
padding: 5px 10px;
font-family:
"Arial","Helvetica",sans-serif;
border-top: 0;
border-image: initial;
height: 35px;
background: #EFF8FB;
width: 260px;
}
#email-news-subscribe .email-box
input.email {
background: #FFFFFF;
border: 1px solid #dedede;
color: #999;
padding: 7px 10px 8px 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
border-image: initial;
font-family:
"Arial","Helvetica",sans-serif;
}
#email-news-subscribe .email-box
input.email:focus {
color: #333
}
#email-news-subscribe .email-box
input.subscribe {
background: -moz-linear-gradient(center
top,#FFCA00 0,#FF9B00 100%);
background: -webkit-gradient(linear,left
top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00));
background: -moz-linear-gradient(center
top,#FFCA00 0,#FF9B00 100%);
-pie-background:
linear-gradient(270deg,#ffca00,#ff9b00);
font-family:
"Arial","Helvetica",sans-serif;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border: 1px solid #cc7c00;
color: white;
text-shadow: #d08d00 1px 1px 0;
padding: 7px 14px;
margin-left: 3px;
font-weight: bold;
font-size: 12px;
cursor: pointer;
border-image: initial;
}
#email-news-subscribe .email-box
input.subscribe:hover {
background: #ff9b00;
background-image:
-moz-linear-gradient(top,#ffda4d,#ff9b00);
background-image:
-webkit-gradient(linear,left top,left bottom,from(#ffda4d),to(#ff9b00));
filter:
progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
outline: 0;
-moz-box-shadow: 0 0 3px #999;
-webkit-box-shadow: 0 0 3px #999;
box-shadow: 0 0 3px #999
background:-webkit-gradient(linear,left
top,left bottom,color-stop(0,#ffda4d),color-stop(1,#ff9b00));
background: -moz-linear-gradient(center
top,#ffda4d 0,#ff9b00 100%);
-pie-background:
linear-gradient(270deg,#ffda4d,#ff9b00);
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border: 1px solid #cc7c00;
color: #FFFFFF;
text-shadow: #d08d00 1px 1px 0
}
</style>
<div
id="socialnetworking">
<!-- Begin Widget -->
<div class="fb-likebox">
<!-- Facebook -->
<center>
<a style="margin-right: 10px;" rel="me"
href="https://plus.google.com/102447978142529993698" target="_blank">
<img
src="http://2.bp.blogspot.com/-TtecU81mxEA/TrHxZowPn9I/AAAAAAAABI8/UGSwDMYkt-c/s1600/Button
G.png" /></a>
<a style="margin-right: 10px;" href="
http://www.facebook.com/ComFugeAWorldOfGeeks" target="_blank"
rel="nofollow">
<img src="http://2.bp.blogspot.com/_rLYhkzmU7RY/TED5ihk9m6I/AAAAAAAAABI/v_2rKVhRE0g/s320/1oaxc4.jpg.png"
/></a>
<a style="margin-right: 10px;"
href="http://feeds2.feedburner.com/comfuge-aWorldOfGeeks"
target="_blank" rel="nofollow">
<img src="http://3.bp.blogspot.com/_rLYhkzmU7RY/TED5SYSjFII/AAAAAAAAABA/xcmxc456JgQ/s1600/2d7itk9.jpg.png"
/></a>
<a style="margin-right: 10px;"
href="http://feedburner.google.com/fb/a/mailverify?uri=Comfuge-aWorldOfGeeks&loc=en_US"
target="_blank" rel="nofollow">
<img src="http://1.bp.blogspot.com/_rLYhkzmU7RY/TED5LW-dTrI/AAAAAAAAAAw/mozQRQcCttU/s320/j5krgl.jpg.png"
/></a>
<a style="margin-right: 10px;"
href="http://twitter.com/#!/ComFugeaworld" target="_blank"
rel="nofollow">
<img src="http://3.bp.blogspot.com/_rLYhkzmU7RY/TED5Omxmx_I/AAAAAAAAAA4/iU6SVPqEQWI/s1600/3312cmr.jpg.png"
/></a>
</center>
</div>
<div
class="googleplus">
<span><font><font>Recommend
Us On Google </font></font></span>
<!-- GooglePlus -->
<!-- Place this tag where you
want the 1 button to render -->
<g:plusone
size="medium"
href="http://www.comfuge.org/"></g:plusone>
<!-- Place this render call
where appropriate -->
<!-- Place this render call
where appropriate -->
<script
type="text/javascript">
(function() {
var po =
document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src =
'http://comfuge6.googlecode.com/svn/google_plus_new.js'; var s =
document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<div class="fb">
<!-- Twitter -->
<iframe src="//www.facebook.com/plugins/like.php?
href=http://www.facebook.com/ComFugeAWorldOfGeeks&&send=false&layout=button_count&width=450&s
Please delete this comment and join the breaking url , so that this code can work...
how_faces=true&action=like&colorscheme=light&font=verdana&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowtransparency="true">
href=http://www.facebook.com/ComFugeAWorldOfGeeks&&send=false&layout=button_count&width=450&s
Please delete this comment and join the breaking url , so that this code can work...
how_faces=true&action=like&colorscheme=light&font=verdana&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowtransparency="true">
</iframe>
<span>Like Us On
Facebook</span>
</div>
<div
class="twitter">
<!-- Twitter -->
<iframe
allowtransparency="true" frameborder="0"
scrolling="no"
src="http://platform.twitter.com/widgets/follow_button.1335513764.html#_=1335528101755&id=twitter-widget-0&lang=en&screen_name=ComFugeaworld&show_count=true&show_screen_name=true&size=m"
class="twitter-follow-button" style="width: 244px; height: 20px;
" title="Twitter Follow Button">
</iframe>
<script
src="http://comfuge6.googlecode.com/svn/twitter_new.js"
type="text/javascript"></script>
</div>
<div
class="pterest">
<a
href="http://pinterest.com/ComFugeaworld/"><img
src="http://passets-cdn.pinterest.com/images/about/buttons/follow-me-on-pinterest-button.png"
width="169" height="28" alt="Follow Me on
Pinterest"/></a>
</div>
<div
id="email-news-subscribe">
<!-- Email Subscribe -->
<div
class="email-box">
<form action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow"
onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=comfuge-aWorldOfGeeks
', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input class="email" type="text"
style="width: 140px; font-size: 12px;" id="email"
name="email" value="Enter Your Email here.."
onfocus="if(this.value==this.defaultValue)this.value='';"
onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="hidden" value="hblogger"
name="uri"/>
<input type="hidden" name="loc"
value="en_US"/>
<input class="subscribe" name="commit"
type="submit" value="Subscribe"/>
</form>
</div>
</div>
<div id="widgetbox"
style="background: #FBEFEF;border-top: 1px solid #ddd;padding: 1px 8px 1px
3px;text-align: right;border-image: initial;font-size:10px;font-family:
"arial","helvetica",sans-serif;">
<span
class="author-credit" style="font-family: Arial, Helvetica,
sans-serif;"><a href="http://www.comfuge.org/2012/11/how-to-add-stay-connected-gadget-having.html"
target="_blank">Get This »</a></span>
</div>
<div
id="fb-root"></div>
<script>(function(d, s, id)
{
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src =
"//http://comfuge6.googlecode.com/svn/facebook_new.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script',
'facebook-jssdk'));</script>
<!-- End Widget -->
</div>
--------------------------------------!!-------------------------------------------!!--------------------------------
Press Ctrl+F and Find the
keywords in the code, then replace it as shown below…
·
Replace http://www.facebook.com/ComFugeAWorldOfGeeks to http://www.facebook.com/Your_Facebook_Username.
·
Replace http://feeds2.feedburner.com/comfuge-aWorldOfGeeks to http://feeds2.feedburner.com/Your_Feedburner_username.
·
Replace http://feedburner.google.com/fb/a/mailverify?uri=Comfuge-aWorldOfGeeks&loc=en_US
to http://feedburner.google.com/fb/a/mailverify?uri=Your_Feedburner_Username&loc=en_US.
·
Replace https://plus.google.com/102447978142529993698 to https://plus.google.com/Your_Google+_Username.
·
Replace http://www.facebook.com/ComFugeAWorldOfGeeks&&send=false&layout=button_count&width=450&show_faces=true&action=like&colorscheme=light&font=verdana&height=21
to http://www.facebook.com/Your_Facebook_username&&send=false&layout=button_count&width=450&show_faces=true&action=like&colorscheme=light&font=verdana&height=21.
· Replace http://platform.twitter.com/widgets/follow_button.1335513764.html#_=1335528101755&id=twitter-widget-0&lang=en&screen_name=ComFugeaworld&show_count=true&show_screen_name=true&size=m
to http://platform.twitter.com/widgets/follow_button.1335513764.html#_=1335528101755&id=twitter-widget-0&lang=en&screen_name=Your_twitter_Username&show_count=true&show_screen_name=true&size=m.
·
Replace http://feedburner.google.com/fb/a/mailverify?uri=comfuge-aWorldOfGeeks to http://feedburner.google.com/fb/a/mailverify?uri=Your_FeedBurner_Username.
·
This gadget provides us with
Facebook Like button, Google +1 button, Twitter follow button, Pinterest Follow
button and Email subscription option, along with their social icons.
Step 5:- Now,
save that HTML/ Javascript code in your Layout page and thus your Stay
Connected Gadget is ready to use.
If you have any queries related
to this post, then you may comment below..
Author - Pallav Jain
