How my blog change to three column of page element and blog spots?

Previouly, my blog is with normal layout one blog posts and one column of `add page element` and yesterday i able to change my blog to become one blog posts and two column of `add page element`. It's means that i have more space to put the thins i want and more add can be put in on one page view.
*old blog with one blog posts and one column `page element`

*new blog with one blog posts and two column of `page element`

below i will share on how i change my blog yesterday,
1. need to log in www.blogger.com and go in "layout"

2. we need to change html code of the blog and go in "edit html"

3. before we change anything on blog html, we must download the original template as if you feel dislike new blog template or amend wrong html code then you still got a chance to recover back your original blog. The template will download in a xml document and when you want to recover back your original blog, just upload a template on your hard drive.

4. now we will start to edit our own blog html, we will need to change the size of layout as we need to add in one more `page element`. Try to find outer-wrapper (can use CTRL F to search for word). Original is 660px and i change to 980px so your blog will look widther.


5. change on header-EASY MAKE MONEY ONLINE, if you want your header to look similar with your blog width then you need to find header-wrapper to change from 660px to any size you wish.


6. main-wrapper mean blog posts, you can change to size that you wish but need to count in others two `page element` size to fit in 980px outer-wrapper.


7. sidebar-wrapper mean the `page element`. I will change sidebar-wrapper to right-column (can rename as you wish), width from 220px to 180px as need to fit in and float: $endSide to right.


8. on step 7, you already change to right-column or others, now you need to find sidebar-wrapper to change to right-column as well.

9. now we will add in one more column for page element, need to key in below html under right-column html.

#rightsidebar-left {
margin:0 0 0 10px;
width: 180px;
float: left;
word-wrap: break-word;
overflow: hidden;
}


10. same as right-column, you need to add another html code show as below in between main-wrapper and right-column.

11. finally, you can save your template and figure out your new blog template.
If you feel that original is better or you make a mistake when amending html code, you still can recover your original template with upload previous backup template.

*if you think you want your main blog in middle and on left and right side is `page element`, all you have to do is move your "div id='rightsidebar-left'" hole html above "div id='main-wrapper'".
At last, thanks for reading.
Please do not hesitate to put in message or comment.