Metro Style Social Icons for Blog

Κάτι νέο που βρήκα για τα Social σας, αυτό το widget είναι ένας όμορφος τρόπος παρουσίας για τους επισκέπτες σας.


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

<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/AVvXsEigOyu6rxdsUF8iW1m0NsZCe7Dp0uIQSF-z3XdEOOEIzL0MiA9kWsUa4Y7UknQ_UYc4rdgy1f_zBbBo3dCzPwO3ywkpR1N0-y-gudN5gTzg4euK7FYiB2sM-pk44Nnry3nDsjh4NIQ1YtY/s1600/rss.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/AVvXsEi5BMscCf69zeCrBAt5iPQ5_wuP7AxK2bVCD1qK70Sxlno14FxXNJ1wIkxLtRIdW3QI7H2sWEuYBbN8lxASxbazRsxa7yf4rtR1riTYHqWZ6gVsM3pwN_rQMFTGifES6mQwmxGWE9gCQ5g/s1600/twitter.png" width="147" /></a></li>
<li class="facebook-icon"><a href="https://www.facebook.com/pages/Fouls-Code/548164921863886" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaLOUdeDl4DkqC5p7XMg4eOLLUhhiIg-JaxlIEy2cIzkgiHaqezR8o5akk6ImSq62ld8zGw0I382irU0_wXLMnpXgQhU89STjVSCxV9-y7Fp06vpkWmuXsVKq1fZO58ACIrHEuwpK46Zk/s1600/facebook.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/AVvXsEgfBg6sLzKG-apnelzioYke9appolkwkuWa15Z1PbFpgDOWkgec3iv0b07zvQNKeJdB57120bpEYHGtynak1xUM_W-HRzcG8eTZKNq4vfUJRmJcX6bNItgAeRuRwSXBkz9wzeJGwvhgz4E/s1600/google.png" width="147" /></a></li>
</ul>
</center>
<style>
/* foulscode.blogspot.gr */
#abt-social-icons li {
 float: left;
 width: 147px;
 height: 147px;
 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.blogspot.gr */
</style>

LIVE DEMO


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