Chia Main Body thành 2 hay nhiều cột

Main Body là thành phần quan trọng nhất trong template Blogspot, là nơi chứa đựng gần như toàn bộ nội dung của một Blog, nhưng khả năng tùy biến lại rất hạn chế đối với mẫu simple template của Blogger ( chỉ có một cột chính ).

Để tránh sự nhàm chán và tạo nên sự độc đáo khác biệt, bài viết dưới đây Tanchau123 sẽ hướng dẫn các bạn một vài thao tác đơn giản để chia Main Body thành 2 hay nhiều cột với kích thước tùy ý.

BẮT ĐẦU THỦ THUẬT:

1. Vào Thiết kế > Chỉnh  sửa HTML

2. Chèn đoạn code bên dưới vào trước thẻ đóng </head>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type="text/css">
.post {position: relative;width: 192.5px;height: 320px;margin: 0 15px 0 0;padding:10px;float: left;overflow: hidden}
.post-body{margin: 0 auto;padding:0;line-height:1.6em}
.post h3{margin: 50 0 10px; padding:0; line-height:1.2em}
.post-footer{display:none}
.date-header{display:none}
</style>
</b:if></b:if>

* Các bạn lưu ý code in đậm màu đỏ và thay thế cho phù hợp

Ở ví dụ trên, Main Body được chia làm 2 phần có tổng chiều rộng là 800px, được tính theo công thức :

Main Body = 2 x 192.5 px + 2 x 15 px + 4 x 10 px = 800 px

Do vậy, để chia thành 3,4 hay n phần thì bạn cần áp dụng công thức trên để tính toán cho hợp lý.

3. Tìm trong template đoạn code bên dưới

#blog-pager {
  text-align: center;
}

và thay thế thành

#blog-pager {
  text-align: center;clear:both;padding-top:20px;
}

Lưu ý : Khi sử dụng thủ thuật này, nhất thiết bạn phải chèn JumpLink cho mỗi bài post, hoặc sử dụng Auto Readmore.

4. Save Template và tận hưởng thành quả nào các bạn !

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

Theo itechplus