Tạo 3 Cột Phần tử ở phần Footer của Template
Chẳng hạn như đối với giao diện hiện tại của Blog tin học, mặc định template chỉ có 1 sidebar nên đã bị mất đi khá nhiều khoảng trống, chưa kể phần Footer thì chỉ có 1 cột (column) càng khiến cho Blog không thể chèn thêm nhiều tiện ích. Nếu Blog của bạn cũng gặp trường hợp tương tự, thì bài viết hôm nay sẽ giúp bạn giải quyết tình trạng này, bằng cách tạo 3 column cho Footer.
- Đăng nhập vào Blogger > Layout > Edit HTML (không cần Mở rộng Mẫu tiện ích).
- Thay thế thẻ <b:section class='footer' id='footer'/> bằng đoạn code dưới đây :<div id='customize-footer-column'>
<div id='Footer1' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='Col1' preferred='yes' style='float:left;'>
</b:section>
</div>
<div id='Footer2' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='Col2' preferred='yes' style='float:left;'>
</b:section>
</div>
<div id='Footer3' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='Col3' preferred='yes' style='float:right;'>
</b:section>
</div>
<div style='clear:both;'/>
</div> - Tìm thẻ ]]></b:skin> và dán đoạn code này ngay bên trên#customize-footer-column {
clear:both;
}
.footer-column {
padding: 10px;
} - Save lại template và chuyển sang tab Page Elements (Phần tử trang để xem kết quả)
Đăng nhận xét