Customize your blogspot Blog with these social media buttons.
HOW TO INSTALL ?
-It's simple go to your blogspot
-Then Layout > Then >Add Gadget > Then HTML/JAVASCRIPT
DEMO : http://testxbd.blogspot.com/2017/02/social-share-demo.html
Then paste These codes
Save and Enjoy<style type="text/css">
#buttoncb ul {margin:10px 15px;padding:0px;}
#buttoncb ul li {list-style-type: none;padding: 0;background: transparent;margin: 0;}
#buttoncb ul li a{background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAbeqObwT9BKJDTwYBjpOMXX0R_5ytSBvurQK6aaLKIn3NKNte54SQn5Zc-kwmnCNkt7RL6jnOKq9yO2-tCGgQm4ZHPv2D1D_gCKPMoCGfqYDNRmG12Ey6w92BJ6Sc4WqAM7KZxpM3neo/s1600/blsocial12.png') 0 0 no-repeat; height:48px;padding-left: 48px;cursor: pointer;text-decoration: none;border-radius:0.5em;-moz-border-radius:0.5em;-webkit-border-radius:0.5em;-o-border-radius:0.5em;display:inline-block;margin:0;width: 220px;}
#buttoncb ul li:hover span {margin-left: 10px;opacity: 1;}
#buttoncb ul li span {border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
color: white;
margin-left: 100px;
opacity: 0;
position: relative;
text-align: center;
width: auto;
padding: 5px 10px;
transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
-moz-transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
-webkit-transition: all 0.3s cubic-bezier(1,2,0,0) 0s;
top: 14px;}
#buttoncb span{padding:5px;background:#000;color:#fff;margin:0 5px;}
#buttoncb .fb span {background-color: #0853A3;}
#buttoncb .twiter span {background-color: #00B1F7;}
#buttoncb .google span {background-color: #9E0202;}
#buttoncb .pint span {background-color: #D00;}
#buttoncb .linkedin span {background-color: #005075;}
#buttoncb .devart span {background-color: #4C7A4A;}
#buttoncb .ytube span {background-color: #A00;}
#buttoncb .rss span {background-color: #EC5601;}
#buttoncb a.fb { background-position: 0 -384px;}
#buttoncb a.twiter { background-position: 0 -432px;}
#buttoncb a.google { background-position: 0 -480px;}
#buttoncb a.pint { background-position: 0 -528px;}
#buttoncb a.linkedin { background-position: 0 -576px;}
#buttoncb a.devart { background-position: 0 -624px;}
#buttoncb a.ytube { background-position: 0 -672px;}
#buttoncb a.rss { background-position: 0 -720px;}
#buttoncb a.fb:hover { background-position: 0 0px;color: #0374DD;}
#buttoncb a.twiter:hover { background-position: 0 -48px;color: #00A1DF;}
#buttoncb a.google:hover { background-position: 0 -96px;color: #A70000;}
#buttoncb a.pint:hover { background-position: 0 -144px;color: #C00;}
#buttoncb a.linkedin:hover { background-position: 0 -192px;color: #005772;}
#buttoncb a.devart:hover { background-position: 0 -240px;color: #4C7A4A;}
#buttoncb a.ytube:hover { background-position: 0 -288px;color: #A00;}
#buttoncb a.rss:hover { background-position: 0 -336px;color: #EC5601;}
</style>
<div id="buttoncb">
<ul>
<li ><a href="http://facebook.com/weblizards.xyz" class="icon fb" ><span>Facebook</span></a></li>
<li ><a href="Your Twitter Page URL" class="icon twiter" ><span>Twitter</span></a></li>
<li ><a href="Your Google+ ID" class="icon google" ><span>Google+</span></a></li>
<li ><a href="Your Pinterest ID" class="icon pint" ><span>Pinterest</span></a></li>
<li ><a href="Your Linkedin Page URL" class="icon linkedin" ><span>LinkedIn</span></a></li>
<li ><a href="Your Deviant Art URL" class="icon devart" ><span>DeviantArt</span></a></li>
<li ><a href="Your Youtube ID" class="icon ytube" ><span>Youtube</span></a></li>
<li ><a href="Your RSS ID" class="icon rss" ><span>RSS</span></a></li>
</ul>
</div>

0 Comments
Please do not Spam