Today the post on About Social Subscriptions Buttons , Labnol is one of the famous technology blog run by Amit Aggarwal.Amits Agarwal holds an the Engineering degree in the Computer Science from IIT and has previously worked at ADP Inc. for the clients like Goldman Sachs & the Merrill Lynch. In 2004, Amit quit his job to become a India’s first and only Professional Bloggers. Labnol blog is looking for simple but fantastic. He is updating his blog regularly with useful contents.Today, I want to share this tutorial regarding the "Labnol Like Social Subscription Buttons For Blogger Blogs." Are you ready :)
See the Live Demo :)
You can be easily get this widget for yours blog. Just Follow the Following steps ..
LATEST INSTALL LABNOL LIKE SOCIAL SUBSCRIPTION BUTTONS FOR BLOGGER BLOG :
- Firstly, Go to Blogger Dashboard -->> Layout -->> Add A Gadget --> HTML/JAVASCRIPT
- Now Paste The following Code Shown Below Inside It.
<style>
.bdsocial {
display: block;
margin: 2em auto;
width: 200px;
height:40px;
}
.bdsocial span {
float: left;
display: inline;
margin-right: 8px;
}
.bdsocial span a {
display: block;
width: 32px;
height: 32px;
text-indent: -9999px;
background-color: none;
background: transparent url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj47khyphenhyphenCa4A-laZyWhXBF-x6CDgMrwgI5HvvIG4R6123tNkyuAUgCzvW3f3MjfxGYjOJhKUD7wWkVsZmEDiAEahwmIdK0domLWCZgGBpp7BHxyWN8RMXZyxVqqbFbfBaAwc-SgcUI873uQ/s1600/blogsdaddy.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}
h6 {font: 90%/1.5em arial, helvetica, sans-serif;
color: #909090;text-transform:uppercase;margin-bottom:10px;}
#footer-logo{text-align:center;margin:10px 0 20px;clear:both}
#footer-logo a{color:#000;text-decoration:none}
.footer-rss{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj47khyphenhyphenCa4A-laZyWhXBF-x6CDgMrwgI5HvvIG4R6123tNkyuAUgCzvW3f3MjfxGYjOJhKUD7wWkVsZmEDiAEahwmIdK0domLWCZgGBpp7BHxyWN8RMXZyxVqqbFbfBaAwc-SgcUI873uQ/s1600/blogsdaddy.png") no-repeat scroll 0 -180px transparent;display:inline-block;height:20px;width:42px;margin-right:12px;vertical-align:baseline;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px}
.footer-nav{margin:0 auto 20px;width:100%}
.footer-nav a{margin:0 4px; color: #666;}
.footer-nav{margin:0 auto 20px;padding:15px 0 0;border-top:solid 1px #ccc;width:86%;text-align:center}.footer-nav
li{padding:0;margin:0;display:inline;list-style:none}.footer-nav a{font:100% "OFL Sorts Mill Goudy TT", Georgia, Times, serif;margin:0 8px;text-transform:uppercase;text-decoration:none}
</style>
<div class='bdsocial'><span><a href='http://www.twitter.com/newfbchat' id='iconTwitter' target='_blank' title='Twitter'>Twitter</a></span> <span><a href='http://www.facebook.com/newfaceboookchat' id='iconFacebook' target='_blank' title='Facebook'>Facebook</a></span> <span><a href='http://feeds.feedburner.com/newfacebookchat' id='iconRSS' target='_blank' title='RSS Feed'>RSS</a></span> <span><a href='http://www.youtube.com/newfacebookchat' id='iconYouTube' target='_blank' title='YouTube Channel'>YouTube</a></span> <span><a href='https://plus.google.com/102059556415595273153' id='iconGooglePlus' target='_blank' title='Google Plus'>Google</a></span></div>
- Now, Replace The Bolded Red Color Links With Yours Links.
- Save Your's Template And Now Its Done..!! !
Any Problem Facing Discuss in Comments Let me know ... Hope You Like this Post .
No comments:
Post a Comment