Header Ads

  • Breaking News

    Social Media "Follow Me" Buttons za Blogger

    Moram na engleskom :) Social media :) Pa kako drugačije... socijalni mediji prati me dugmad :))) 
    Šta da vam pričam kad znate, kopirajte kod i dodajte u HTML gadget, zamenite adrese, dole su podebljane žutom bojom i to je sve.

    Live Demo
    <style>
    #abt{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;}
    #abt a{text-decoration:none; font-family:trebuchet ms,sans-serif;}
    #abt li{position:relative; height:38px; cursor:pointer; padding: 0 !important;}
    #abt .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://lh6.googleusercontent.com/-O_eNfqyGbXY/Ua7QecE1aiI/AAAAAAAAA_M/CyeEAD56u1M/w35-h158-no/facebook+and+google%252B+.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;}
    #abt li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;}
    #abt .icon{overflow:hidden; color:#fafafa;}
    #abt .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;}
    #abt .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;}
    #abt .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;}
    #abt .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;}
    #abt .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;}
    #abt li:hover .icon,
    .touch #abt li .icon{width:210px;}
    .touch #abt li .facebook, #abt li:hover .facebook{background-color:rgba(59,89,152,1);}
    .touch #abt li .twitter, #abt li:hover .twitter{background-color:rgba(64,153,255,1);}
    .touch #abt li .googleplus, #abt li:hover .googleplus{background-color:rgba(228,69,36,1);}
    .touch #abt li .pinterest, #abt li:hover .pinterest{background-color:rgba(174,45,39,1);}
    .touch #abt li .rss, #abt li:hover .rss{background-color:rgba(255,102,0,1);}
    </style>
    <ul id="abt">
    <li data-alt="Follow us on Facebook"><a class="icon facebook" href="https://www.facebook.com/pages/Bloger-Girl/732237670136151"target="blank">Follow us on Facebook</a></li>
    <li data-alt="Follow us on Google+"><a class="icon googleplus" href="https://plus.google.com/u/3/+MilicaMM/posts"target="blank">Follow us on Google+</a></li>
    <li data-alt="Follow us on twitter"><a class="icon twitter" href="https://www.twitter.com/bloger_girl"target="blank">Follow us on Twitter</a></li>
    <li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="http://pinterest.com/Micy3/"target="blank">Follow us on Pinterest</a></li>
    <li data-alt="Subscribe via RSS"><a class="icon rss" href="http://feeds.feedburner.com/blogspot/ekWMe"target="blank">Subscribe via RSS</a></li>
    </ul>
    <small><div style="font-size:50%; text-align:right;"><a href="http://mix--er.blogspot.com/" target="_blank" title="Get This Widgets">Widget by MMM</a></div></small>


    https://www.facebook.com/pages/Bloger-Girl/732237670136151

    https://plus.google.com/u/3/+MilicaMM/posts

    https://www.twitter.com/bloger_girl

    http://pinterest.com/Micy3/

    https://www.twitter.com/bloger_girl

    http://feeds.feedburner.com/blogspot/ekWMe

    Zamenite ovo podebljano žutom bojom, vašim adresama, URL vaših stranica i socijalnih mreža




    No comments

    Post Top Ad

    Post Bottom Ad