Hướng dẫn thêm Footer Widget 3 cột responsive cho blogspot

Cộng tác viên 03:48 #Blogger #Thủ Thuật #Thủ Thuật Blogspot

Chào các bạn, hôm nay mình sẽ hướng dẫn các bạn thêm phần Footer Widget

3 cột responsive cho blogspot.

Cách thực hiện

Bước 1: Copy đoạn CSS sau và dán lên  trước thẻ ]]></b:skin> trong blog của bạn

#footer-wrapper{background:#242424;overflow:hidden;margin:0 auto;padding:20px 15px 0;color:#ddd}#footer-wrapper .left{float:left;width:34%}#footer-wrapper .center{float:left;width:34%}#footer-wrapper .right{float:right;width:32%}#footer-wrapper .left .widget,#footer-wrapper .center .widget{margin:0 15px 15px 0;clear:both}#footer-wrapper .right .widget{margin:0 0 15px;clear:both}@media screen and (max-width:768px){  #footer-wrapper .left{float:none;width:100%}  #footer-wrapper .center{float:none;width:100%}  #footer-wrapper .right{float:none;width:100%}  #footer-wrapper .left .widget,#footer-wrapper .center .widget{margin:0 0 15px;clear:both}}

Bước 2: Tìm đến phần Footer trong blog của bạn và dán đoạn HTML sau vào đó

<!-- Footer --><div id='footer-wrapper'>  <b:section class='left' id='left' preferred='yes'/>  <b:section class='center' id='center' preferred='yes'/>  <b:section class='right' id='right' preferred='yes'/></div><div class='clear'/><!-- Footer Widget End --> 

Cuối cùng bạn chỉ cần lưu lại và vào bố cục thêm các widget cho phần footer của bạn là xong.
Chúc các bạn  thành công! 

0 bình luận

Chia sẻ