Chân trang 3 cột trên google thì nhiều và toàn những bài cũ của các blogger từ xưa đến giờ nên không hỗ trợ Responsive cho chân trang blogspot của bạn. Nếu một blog mà không có Responsive thì nó sẽ rất xấu trên mọi kích thước, vì đó nó sẽ rất gây khó chịu cho khách truy cập blog của mình. Đoạn css sau đây sẽ đáp ứng tất cả về vẽ đẹp gọn nhẹ của nó cũng như Responsive trên thiết bị mobile.
Hướng dẫn tạo footer 3 cột
Thêm đoạn css sau vào <b:skin><![CDATA[
#footer-zalosec{background:#242424;overflow:hidden;margin:0 auto;padding:20px 15px 0;color:#dddddd;}
#footer-zalosec .left{float:left;width:34%}
#footer-zalosec .center{float:left;width:34%}
#footer-zalosec .right{float:right;width:32%}
#footer-zalosec .left .widget,#footer-zalosec .center .widget{margin:0 15px 15px 0;clear:both}
#footer-zalosec .right .widget{margin:0 0 15px 0;clear:both}
@media screen and (max-width:768px){
#footer-zalosec .left{float:none;width:100%}
#footer-zalosec .center{float:none;width:100%}
#footer-zalosec .right{float:none;width:100%}
#footer-zalosec .left .widget,#footer-zalosec .center .widget{margin:0 0 15px;clear:both}
}
Sau đó các bạn đặt đoạn này trên phần footer gốc là được
<div id='footer-zalosec'>
<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'/>
Hướng dẫn fix lỗi nếu template không phù hợp
Nếu bị bể footer thì các bạn có thể thêm đoạn css sau để căng chỉnh lại chân trang cho phù hợp template của mình
width:965px;Ví dụ :
#footer-zalosec{background:#242424;overflow:hidden;margin:0 auto;padding:20px 15px 0;color:#dddddd;width:965px;}Các bạn chỉnh lại 965px cho phù hợp với template của mình là được sau đó nó sẽ hiện footer 3 cột cho blogspot blogger của bạn