Style Social Icons for Blog/Site





Ένα wdget για το site και blog σας με όμορφα και κομσά εικονίδια σε τύπο .png και με ένα ελαφρό εφέ καθώς το βελάκι είναι πάνω σε ένα από τα εικονίδια.

Δείτε το [ LIVE DEMO ]

Συντονιστείτε συνεχώς θα δημιουργό καινούρια και ότι αλλα βρίσκω θα τα μοιράζομαι!!

Για να το προσαρμόσετε κάντε αντιγραφή επικόλληση τον παρακάτω κώδικα:



<center>
<ul id="abt-social-icons">
<li class="rss-icon"><a href="http://foulscode.blogspot.com/feeds/posts/default" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqOdkr0Ve7HBO1-efXWCAo9KSF-WJpaKeAgIgaSG3DHyMwkeHotXwxUJC16Fw31-ukzxRHPiaeVYSQiCL57Y11kL7AzGmWVrgd7g2-Fv4od7nqlwc4DrbDO6Y17uChIN-0-2B30452D10/s1600/rss-icon-48.png" width="147" /></a></li>
<li class="twitter-icon"><a href="http://www.twitter.com/foulscode" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivet_mDuhLK8oCYB_TRnAmnqaYr1y4QGglWaan3MCoNxqMJaLb9K4tmlPg4T-Cu3kNmofgI1NPOvCqEOj2j231L3ruPlxYswAe9qj6VbHIDP3_ZTb_xGN-ES3HuU8PJjXskzDC2qohQ1I/s1600/Twitter-icon-48.png" width="147" /></a></li>
<li class="facebook-icon"><a href="https://www.facebook.com/pages/FoulsCode/548164921863886" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl4uoNpZ2B27eJQVV-Srjv3OKh5_C1wYOxZPblONSQnvWYArmVGCdSXMTO4IpNZ8Pjp9NHJj8cxplA1thCphD7OfROHNMWbXv4qExySSj5QzKkKQFgYjWR79I8mt5rznr5p4IL3W15tGk/s1600/Facebook-icon-48.png" width="147" /></a></li>
<li class="google-icon"><a href="https://plus.google.com/109721759993422268214" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwVC2CDfLAloUVoDTfTsp7sLeQfsv_ZrM2Ti9bh1KlE3EUQyI_4fycqY_Pae7iCDpiYKQQClY0ukFiKm-RaVbmw1HO-yf-kOdSCRK-fwrTa78cvUpzdrpOjibqLuPC7SrriCICYgrURTQ/s1600/Googleplus-icon-48.png" width="147" /></a></li>
<li class="google-icon"><a href="https://gr.pinterest.com/FoulsCode/" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh57WslqR9Jkot-T39e6RA07-9ml6H0hF5phtQjJTp_mlukfEy7q06741-tjLLyFnqf1jY-thPWrTmXc1zugQvKEevGCiIgzbS3CMvYVWv3QOEtixbDZJi-g4O4ERmxpYGlYbCfSqMnYiA/s1600/pinterest-icon-48.png" width="147" /></a></li>
<li class="google-icon"><a href="http://FoulsCode.com/ email" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdj6ERqXXZkHWjIt6J0ku6nxlYhaVGDIXNNxAOLQriyy9qE_5r3J5iJXiwcDQfVPKq4PX3ZatT19te9bTHjpuPa8QzED7zzH6cyxQr7JTWMBQJp8ygXU2xkOnCq-TqP8OvDDOWtca9qq8/s1600/mail-icon-48.png" width="147" /></a></li>
</ul>
</center>
<style>
/* foulscode.com */
#abt-social-icons li {
 float: left;
 width: 48px;
 height: 48px;
 margin: 0 6px 6px 0;
 padding: 0 0 0 0;
 border-bottom: none;
        list-style: none;
}
#abt-social-icons li a {
 line-height: 1px;
 display: block;
}
#abt-social-icons li a:hover img {
 -webkit-opacity: 0.8;
 -moz-opacity: 0.8;
 opacity: 0.8;
}
#abt-social-icons li a span {
 display: none !important;
}
/* foulscode.com */
</style>



Αντικαταστήστε τα μαρκαρισμένα URL και μετά αποθήκευση.


Σχόλια