Hôm nay Hồng Designer sẽ hướng dẫn các bạn Thêm widget biểu tượng mạng xã hội cho blogger. Tôi đã thấy tiện ích này rất nhiều lần trong các blog WordPress khác nhau vì vậy tôi nghĩ chuyển đổi nó cho blogger. Widget này có làm việc rất đơn giản. Trên di độ mờ đục của những thay đổi biểu tượng và làm cho là mờ hơn.Tiện ích này có thể giúp blog của bạn có được phương tiện truyền thông xã hội nhiều hơn khán giả tối ưu hóa. Những cái nhìn thanh lịch của tiện ích này có thể làm cho nhiều người nhấp vào nó. Nếu bạn thích thì mần ngay còn chờ gì nữa :))
Thêm widget biểu tượng mạng xã hội cho blogger :
Để thêm mã của widget này đi vào Blog Bố cục→ Thêm Widget → HTML / JavaScript và dán đoạn mã được đưa ra trong hộp mở ra.<center>Sau khi thêm code thì chỉnh sửa phần màu đỏ thành ID của bạn nhé, Lưu widget lại và kiểm tra thành quả mình vừa làm đc. Chúc các bạn thành công !
<ul id="abt-social-icons">
<li class="rss-icon"><a href="http://feeds.feedburner.com/FEEDID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidVWyjj1Z1p3v3AtUM2rX7Upy4ehNYxr__UBD5YEFhOOT9UKrRFvLcVZjs0AbBZBGWw9CuWVdJ-OUOz5az47J0IsnFs0VBmYId7RSSJ1bBo0YbPSJb5cTli9yu0Czc45PdQywuvG3tY6Q/s1600/rss.png" width="147" /></a></li>
<li class="twitter-icon"><a href="http://www.twitter.com/TWITTERHANDLE" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVPlgDIGW37M3hBnbNCCDsUbn04ktIbqkvCnGpH9NMl-lGQM6A9xLxewYRfRMaKTtXKN4DEUbjcqE3SDUbjeA259B8Xf52uI410Jb3UKWWkASIIDAHNB8nySguFa4DJiN7IIyqDdoSFk0/s1600/twitter.png" width="147" /></a></li>
<li class="facebook-icon"><a href="http://www.facebook.com/PAGEID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEindVs2cKlAqj1pwe77NUIDhPKY-jf0_CzYoPofBsiD04tywf5bDnV0l5F7Kqu9-ZhWmtBN-QUSO7tpwCtVKaydyoNCxhYpbex23Ds0CrUNLJ2ZqXwaKKyy1OwlAsn8kH_19dGAzp7KkHk/s1600/facebook.png" width="147" /></a></li>
<li class="google-icon"><a href="https://plus.google.com/YOURID" target="_blank"><img height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifnoDCCSAJgTkALOapkqL9OqGnKVqi22MN2HRB3Brnkdjv61RpjmG621dZ_ODphzAaX0QbDcWhpHWTbLhTVES7fhdb7wP6oBbVFOZjLrT8dCkNbqy0VgsYvrIW8iBUw-0CrTElumLla1M/s1600/google.png" width="147" /></a></li>
</ul>
</center>
<style>
#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;
}
</style>
ConversionConversion EmoticonEmoticon