Još jedna u nizu odličnih widgeta za blog ili sajt. Lako se instalira i super funkcioniše.
Live Demo
Idemo kao i uvek:
Templates > Edit HTML
Nadjite ]]></b:skin> i odmah iznad, dodajte sledeći kod
ul#icon-socialmn{float:right}ul#icon-socialmn li{float:left;display:inline-block;position:relative}ul#icon-socialmn li a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi47N3RkeJlnZIugDB0UDqVsCT5xbgvn_sUMYlQAyGF51gN32KAF68ZRPc5m_wK1ntKZsVUt5dHFuiYoOCVb-AuGEN-jTYecUHemfj2EE72mfV4MPHsRAirgPkbg5k1YsnAQBpgREOmtGL6/s1600/team-social-icons.png);background-repeat:no-repeat;display:block;width:40px;height:47px;text-indent:-9999px;-webkit-transition:background .2s ease-out;-moz-transition:background .2s ease-out;-o-transition:background .2s ease-out;transition:background .2s ease-out}ul#icon-socialmn li.social-twitter a{background-position:4px 7px}ul#icon-socialmn li.social-twitter a:hover{background-color:#2DAAE1}ul#icon-socialmn li.social-facebook a{background-position:-25px 7px}ul#icon-socialmn li.social-facebook a:hover{background-color:#3C5B9B}ul#icon-socialmn li.social-google a{background-position:-54px 7px}ul#icon-socialmn li.social-google a:hover{background-color:#F63E28}ul#icon-socialmn li.social-rss a{background-position:-85px 7px}ul#icon-socialmn li.social-rss a:hover{background-color:#FA8C27}ul#icon-socialmn li.social-linkedin a{background-position:-116px 7px}ul#icon-socialmn li.social-linkedin a:hover{background-color:#0173B2}ul#icon-socialmn li.social-dribbble a{background-position:-146px 7px}ul#icon-socialmn li.social-dribbble a:hover{background-color:#F9538F}ul#icon-socialmn li.social-pinterest a{background-position:-176px 7px}ul#icon-socialmn li.social-pinterest a:hover{background-color:#CB2027}
"Save" template i to je prvi deo
Widget izgleda otprilike ovako, zavisi od bloga i šablona jer neće isto izgledati na svakom blogu, nemojte se iznenaditi ako vam izgleda drugačije. Ako želite još ikonica, potražite na net-u, postoji pregršt sajtova za ikonice.
Sada dodajte ovaj kod bilo gde, gde želite da vam se widget pojavi.
<div dir="ltr" style="text-align: left;" trbidi="on"><ul class="sociico" id="icon-socialmn"><li class="social-twitter" style="background-color: black;"><a href="Your Link Here" target="_blank">twitter</a></li><li class="social-facebook" style="background-color: black;"><a href="Your Link Here#" target="_blank">facebook</a></li><li class="social-google" style="background-color: black;"><a href="Your Link Here" target="_blank">google</a></li><li class="social-rss" style="background-color: black;"><a href="Your Link Here" target="_blank">rss</a></li><li class="social-pinterest" style="background-color: black;"><a href="Your Link Here" target="_blank">pinterest</a></li></ul></div>
Ako želite da zamenite pozadinu, vidite gde piše "black" zamenite bilo kojom vašom bojom a ako ne želite nijednu odnosno transparentno, samo sklonite ovo style="background-color: black;" gore podvučeno sivom bojom.
Dodajte vaše URL adrese i to je sve.
