2 Add Css Badge For Your Blog And Website

Hello Friends Today I Am Gonna Show You How To Add Badge For Your Your Blog With Hover Effecr Its Very Awesome And Don't Decrease Your Blog Speed.So Follow My Steps...............

Live Demo

• Open Your Blogger Account 

• Click On Layout

• And Click On Add Gadget And Select HTML/JAVASCRIPT

• And Paste The Below Code

<style> .BlogTariffCSSBadge{background:#fff;border-radius:10%;cursor:pointer;position:relative;width:15em;height:5em;overflow:hidden;transform:translateZ(0);margin:0 auto} .BlogTariffCSSBadge h1{color:rgba(8,172,233,0);font-family:Lato, sans-serif;font-weight:900;font-size:1.6em;line-height:3em;text-align:center;text-transform:uppercase;-webkit-font-smoothing:antialiased;user-select:none;transition:color .8s ease-in-out} .BlogTariffCSSBadge h1 a{color:rgba(8,172,233,0);text-decoration:none} .BlogTariffCSSBadge:before,.BlogTariffCSSBadge:after{border-radius:10%;content:"";position:absolute;top:0;left:0;width:inherit;height:inherit;box-shadow:inset 10.6em 0 0 rgba(30,140,209,0.2), inset 0 10.6em 0 rgba(30,140,209,0.2), inset -10.6em 0 0 rgba(30,140,209,0.2), inset 0 -10.6em 0 rgba(30,140,209,0.2);transition:box-shadow .75s} .BlogTariffCSSBadge:after{transform:rotate(45deg)} .BlogTariffCSSBadge:hover:before,.BlogTariffCSSBadge:hover:after{box-shadow:inset .86em 0 0 rgba(255,0,0,0.5), inset 0 .86em 0 rgba(252,150,0,0.5), inset -.86em 0 0 rgba(0,255,0,0.5), inset 0 -.86em 0 rgba(0,150,255,0.5)} .BlogTariffCSSBadge:hover > h1 a,.BlogTariffCSSBadge:hover > h1{color:rgba(8,172,233,1)}/* Widget by www.showmedreams.blogspot.com */ </style> <div class="BlogTariffCSSBadge"> <h1><a href="http://www.showmedreams.blogspot.com">SMD</a></h1> </div>

• Note: Change http://www.showmedreams.blogspot.com   With Your Blog Link  

•          Change SMD   With Your Badge Name     

• Now Save Your HTML/JAVASCRIPT 

• Now Check Your Blog

Yipeeeeeeeeeeeeeeeeeeeeeee.........................................

Please Leave Your Question And Comment Below............

------------------------------------------------------------------------------------------------------------

Read More:

How To Add Stylish Author Profile Widget On blogger

Internet Download Manager Full Version