Widget liên kết với các mạng xã hội đẹp cho blogger

Ở bài trước mình đã hướng dẫn tạo WIDGET LIÊN KẾT VỚI CÁC MẠNG XÃ HỘI VÀ NHẬN BÀI VIẾT QUA EMAIL CỰC COOL và hôm nay mình sẽ giới thiệu một widget khác cũng tương tự nhưng là phiên bản rút gọn. Widget này phù hợp với bạn nào có blog dễ thương

Demo

Bạn hãy làm theo các bước hướng dẫn đơn giản sau:

Bước 1: Vào Blogger > Mẫu >Chỉnh Sửa HTML

Bước 2:Chèn code sau trướ thẻ ]]></b:skin>

#subscription {
list-style: none;
margin-top: 0px;
}
#subscription li {
padding: 5px 10px 5px 10px;
height: 60px;
}
#subscription li a {
color: #000;
}
#subscription li a:hover {
color: #DC002C;
}
#subscription li h4 {
margin: 0 0 0 45px;
font-size: 18px;
color: #000;
font-weight: bold;
border: none;
font-family: 'Droid Sans', Helvetica, Arial, sans-serif;
}
#subscription li p {
margin: 0 0 0 45px;
font-size: 13px;
line-height: 1.4em;
color: #666;
}
#subscription li img {
float: left;
padding: 0px;
margin: 0px 10px 0px 0px;
}
#subscription li:hover {
background-color: #f7f9c5;
}

Bước 3: Tạo một widget HTML vào vị trí bạn muốn chèn tiện ích trên và dán code sau vào phần nội dung rồi Lưu lại

<div class='sidebar' id='sidebar-wrapper'>
<div class='widget' style='height: 250px'>
<h2>Blog Subscription</h2>
<ul id='subscription'>
      <li>
     
        <a href='YOUR-LINK-HERE'>
<img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNPfHTAYhEXDNCDheTZJOz5mulB6WlQPvkcVfIsRoLyiEYWmx0NX2oLwSLLN8laNoTLzdS4fXskbavjn3ryLL6Eq_UMFQn12N9PlIVWTBTUgfX9XFRIccCb4pLPL5Gnwyp1nnGTXxLMa8/s1600/twitter.png'/></a>
        <h4><a href='YOUR-LINK-HERE'>Follow me</a></h4>
        <p>You can follow my updates on Twitter</p>
      </li>
      <li>
     
        <a href='YOUR-LINK-HERE'>
<img alt='Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUhSWoz4WJbicqmd6iF7QKeQIJ8KrR0uzyY2zxn-keamdiDImxQgdkaBPOyPK8_ANLhkdy6zL_MqgMI7A42O1UsRFUcqyKC-ovnt2BirpxO-E7_vsq_ZvrJikZUpL6rWfOXY3FJ5Vp1uo/s1600/rss.png'/></a>
        <h4><a href='YOUR-LINK-HERE'>Posts RSS</a></h4>
        <p>Read my full posts on your favorite feed reader</p>
      </li>
<li>
     
        <a href='YOUR-LINK-HERE'>
<img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYyxFkIjgzZr94E6uHr56O2WF13186Fz_Bszj-_JXHfVom6u5LfPrfglsZyC6AuFZrF8XR83KAwug4ITw_GGJDNR3oMfvXYdOMqS-PVJOCSLnadbXF5grvZLsOxQvA1l06zSgmbQiOjdk/s1600/facebook.png'/></a>
        <h4><a href='YOUR-LINK-HERE'>Facebook</a></h4>
        <p>Become a fan of our blog on Facebook</p>
      </li>
    </ul>
</div></div>

Bạn hãy chỉnh lại những phần tô màu xanh và chữ đậm sao cho phù hợp với blog của mình nhé!