Colorful Social Media Subscription Button: Widget For Blogger blog
Some blogs shining with some features .taking one of this that one is colorful subscription scripts . the main thing how to add like widgets those blogging platforms like blogger and WordPress. now exactly how it
Here no used jQuery only CSS . its perfectly match with your blog.
How To Add Colorful Subscription Widget To Blogger Blog
Go to Blogger /Template/Edit HTML/Proceed, Click Expand Widget templates.
<data:post.body/>
Search it above code in template
And paste the following code just below the <data:post.body>
[highlight color="eg. yellow, black"]...[/highlight]
<!-- Code on www.labjel.org-->
<style type='text/css'>
.labjel {
display: block;
margin: 2em auto;
width: 200px;
height:40px;
}
.labjel span {
float: left;
display: inline;
margin-right: 8px;
}
.labjel span a {
display: block;
width: 32px;
height: 32px;
text-indent: -9999px;
background-color: none;
background: transparent url(http://labjel.org/wp-content/uploads/2013/01/social_icons.png) 0 0 no-repeat;
}
#iconTwitter {background-position: -33px -33px;}
#iconFacebook {background-position: -66px -33px;}
#iconRSS {background-position: 0 -33px;}
#iconYouTube {background-position: -99px -33px;}
#iconGooglePlus {background-position: -132px -33px;}
#iconTwitter:hover {background-position: -33px 0;}
#iconFacebook:hover{background-position:-66px 0}
#iconRSS:hover{background-position:0 0}
#iconYouTube:hover{background-position:-99px 0}
#iconGooglePlus:hover{background-position:-132px 0}
</style>
<!-- Code on www.labjel.org--> [highlight color="eg. yellow, black"]...[/highlight]
Now Save Your template .
and go for Layout-Add a Gadget/ HTML/JavaScript
and add it Below code (paste where you need to add)
<div class='labjel'>
<span><a href='http://www.twitter.com/labjel' id='iconTwitter' target='_blank' title='Follow us on Twitter'>Twitter</a></span>
<span><a href='http://www.facebook.com/labjel' id='iconFacebook' target='_blank' title='Join us at Facebook'>Facebook</a></span>
<span><a href='http://feeds.feedburner.com/labjel' id='iconRSS' target='_blank' title='Subscribe our RSS Feed'>RSS</a></span>
<span><a href='http://youtube.com/labjel' id='iconYouTube' target='_blank' title='Follow our YouTube Channel'>YouTube</a></span>
<span><a href='https://plus.google.com/102433797955333952363' id='iconGooglePlus' target='_blank' title='Follow us at Google+'>Google</a></span></div>
Simply add your usernames on it .(user name of Social media accounts of you)
that’s it over for blogger.com
About Author
Gajendran Megajolla
The aim is to share knowledge( Blogger,Wordpress,Adsense and Websites Creation tips and tricks are there to be used on a wide range of needs