Cách thêm cột cho blogger!

Bạn vừa mới lập một cái blog nhưng blogger lại có nhiều tiện ích quá, mà các lựa chọn chỉ cho bạn hai cột. Bạn có muốn làm cho nó trở thành 3 cột ko? Dưới đây là cách để các bạn làm cho blog mình thêm một cột nữa, thỏa thích mà thêm tiện ích!
Đăng nhập vào blogger.http://www.blogger.com/ , chọn Bố cục -> chọn chỉnh sửa HTML, bạn sẽ thấy khung chứa các đoạn code HTML.

tìm đến đoạn code:

#outer-wrapper {

margin: 0 auto;

border: 0;

width: 660px;

text-align: $startSide;

background: $mainBgColor url(http://www.blogblog.com/moto_son/innerwrap.gif) top $endSide repeat-y;

font: $bodyFont;

}

 Chú ý đoạn: width: 660px; Đây là kích cỡ bề ngang trang blog của bạn. Bạn hãy thay số ở vị trí số 660 thành số 970. Để khi bạn thêm cột sẽ có đủ chỗ cho một cột mới.
tiếp theo: Bạn tìm đến đoạn code:

#main { width: 500px;

float: $startSide;

  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */  
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
chú ý đoạn:  width: 400px;  đây là kích cỡ bài viết của bạn hãy tăng lên thành 500 hoặc 550 gì đó tùy ý thích của bạn.
Bây giờ đến đoạn code thứ ba:

#sidebar { width: 226px;  

float: right;  

color: $sidebarTextColor;  

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

Đạn này là code của thanh bên phải: float: right; Như vậy nếu ta thay right thành left thì nó sẽ là thanh bên trái.
Bạn copy hết đoạn code trên và thay right bằng left. Và đổi tên thanh này. Dưới đây là đoạn code sau khi đã sửa.bạn có thể copy đoạn dưới đây dán vào cũng được.

#leftsidebar-wrapper {  

width: 200px;  

float: left;  

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

 Tiếp theo còn hai đoạn code cần phải sửa nữa. Bạn tìm đến hai đoạn code sau:

#footer {  

clear: $startSide;  

width:970px; margin: 0;  

padding: 0 20px;  

border: 0;  

text-align: $startSide;  

border-top: 1px solid #f9f9f9; }

 -----------------------------------------

#header-wrapper{

background: #8b2 url(http://www.blogblog.com/moto_son/headbotborder.gif) bottom $startSide repeat-x;

width:970px;

margin: 0 auto;

padding-top: 0;

padding-bottom: 0;

padding-$endSide 15px;  

padding-$startSide: 0; border: 0;

}
Nếu đoạn code của bạn chưa có hai dòng: width:970px; Thì thêm vào. Nếu đã có rồi thì hãy sữa lại thành 970px như trên.
cuối cùng bạn nhấn nút lưu để hoàn tất.
Dưới đây là đoạn code đã được chỉnh sữa:
-----------------------------------------------------
#outer-wrapper {  
margin: 0 auto;  
border: 0;  
width: 980px;  
text-align: $startSide;  
background: $mainBgColor url(http://www.blogblog.com/moto_son/innerwrap.gif) top $endSide repeat-y;  
font: $bodyFont; }
-------------------------------------------
#main {  
width: 500px;  
float: $startSide;  
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
-------------------------------------------
#main {  
width: 500px;  
float: $startSide;  
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } ---------------------------------------- #sidebar { width: 226px; float: $endSide;  
color: $sidebarTextColor;  
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
---------------------------------------------- 
#leftsidebar-wrapper {  
width: 200px;  
float: left;  
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }
----------------------------------------------
#footer {  
clear: $startSide;  
width:970px;  
margin: 0;  
padding: 0 20px;  
border: 0;  
text-align: $startSide;  
border-top: 1px solid #f9f9f9; }

 --------------------------------------------  

#header-wrapper{

background: #8b2 url(http://www.blogblog.com/moto_son/headbotborder.gif) bottom $startSide repeat-x;

width:970px;

margin: 0 auto;

padding-top: 0;

padding-bottom: 0;

padding-$endSide 15px;  

padding-$startSide: 0; border: 0;

}

Chúc bạn thành công, nếu không được có thể mail cho mình: cuchuoi8995@gmail.com