Chia Post footer thành nhiều cột

[FD's BlOg] - Tương tự bài viết trước (chia footer thành nhiều cột), bài viết này cũng áp dụng thủ thuật tương tự để chia Post Footer (bên dưới bài viết) thành nhiều cột.

Xem hình minh họa thủ thuật:

Còn đây là kết quả hiện thị ngòai blog

Bắt đầu:
1. Đăng nhập blog
2. Vào Bố cục(layout)
3. Vào chỉnh sửa code HTML (edit code HTML)
4. Chọn "mở rộng mẫu tiện ích" (expand widget template)
5. Chèn đọan code màu đỏ vào như bên dưới:

...
...
...

</b:section>
</div>

- Chú ý : bạn hãy điều chỉnh code màu xanh (là độ rộng của các cột) theo đúng kích thước của main post, ví dụ main post của bạn rộng 600px, thì mỗi cột sẽ là 300px, có thể nhỏ hơn (do có thể main post của bạn được căn lề). Và nếu bạn muốn chia thành 3 cột thì thêm một đọa code như bên dưới trước dòng <div style='clear:both;'/> , và chiều rộng mỗi cột bạn đổi lại là 200px.

- Về chiều rộng của các cột bạn không nhất thiết phải chỉnh bằng nhau, tùy theo thiết kế của bạn, bạn có thể tùy chỉnh chúng khác nhau, và phải đảm bảo là tổng chiều rộng phải nhỏ hơn độ rộng của main post.
- Ngòai ra để tạo giao diện các cột, bạn có thể thêm các đoạn code CSS cho nó.

6. Save template.

Chúc các bạn thành công.

16

: hihi...test phát thành công luôn...
: cái thủ thuật này càng ngày em càng thấy nó hay đấy anh dũng à...đêm qua nhờ cái này em đã test và ko chỉ chia side bar mà cả header hay bất cứ cái gì cũng được..hehe
: uh, đúng rồi.

EM cũng khá rành rồi đó, đã biết áp dụng để chia các section khác của blog.

Tốt, cứ vậy mấy bữa nữa là thành pro ngay thôi, khỏi cần anh chỉ nữa :D
: Hix, chỉ mình cách làm cho header đi bạn!
: Bạn muốn chia Header thì cứ thêm dòng code màu đỏ vào sau dòng code này <div id='header'>
: hoặc trước dòng này cũng được : <b:section class='header' id='header' showaddelement='no'>
: hjc, cai nay chua bit
: Bạn giúp mình cái được ko,mình chia như của bạn vậy,nhưng nó lạ đẩy cột về bên trái,ko ở giữa như của bạn,mặc dù chia đều cột cho hàm main.
: Nó bị đẩy là do chiều dài của phần main dài hơn các cột sidebar, bạn thử chỉnh lại căn phải xem (nếu cột sidebar của bạn nằm ở bên trái).
: Mình muốn chèn thêm post footer 1 cột dưới cái post footer 2 cột đã tạo thì làm sao nhỉ? Help mình với!
: @Mr_Lam : bạn thêm code bên dưới vào sau đoạn code màu đỏ của thủ thuật trên là được. Lưu ý : độ rộng của footer 1 cột này phải bằng gấp đôi độ rộng của các footer 2 cột. (như thế để trông bố cục hợp lý hơn)

CODE :
<div id='main-footer-content2'>
<div id='main-footer1' style='width: 480px; float: left; margin:0; text-align: left;'>
<b:section class='main-footer-column2' id='footer2-col1' preferred='yes' style='float:left;'/>
</div>
<div style='clear:both;'/>
</div>
: các bài của bạn thật là bổ ích nó giúp mình rất nhiều cám ơn bạn.Đây đúng là blog kiến thức chuyên đề cần thiế cho mọi người.Bạn cho mình hỏi thêm là nếu mình muốn làm một blog về ảnh thì có cách nào chia bài post thành nhiều cột để hiển thị ảnh nhiều hơn không ví dụ như chia 3 hay 4 côt bài đăng được không bạn.Cảm ơn bạn nhiều lắm
: @kaka12186 : ở đây mình có bài hướng dẫn hiển thị bài viết dạng gallery, thích hợp cho blog post ảnh của bạn, bạn có thể tham khảo ở đây :

http://www.fandung.com/2009/06/thu-thuat-yeu-cau-tao-widget-recent.html
: Chào nhé, bài này rất hay, nhưng bạn có biết cách nào làm cái giao diện như của anh Tran Tinh ở eBlogviet không ?
: Mình cũng đã thử chia footer làm thành 3 cột theo như hướng dẫn trên. Tuy nhiên, khi nhìn trên bố cục thì Ok, nhưng khi "thêm tiện ích" của bất cứ hàng nào, đồng thời dán HTML/Javascript vào thì đều hiển thị nằm sát góc trái? Nhờ bạn chỉ giùm cách nào căn chỉnh lại. Cám ơn nhiều.
: Úh, xin lỗi bạn. Mình nhầm là bất cứ cột nào của footer chứ không phải hàng nào...