Modify Homepage Blogger To 2 Column

How to modify default blogger template homepage? In this tutorial i will explain step by step to create default blogger homepage became 2 column view post. 
e.g

Before we start this tutorial, your post article must have readmore/jump break feature to make this tutorial works. If you already use readmore/jump break at post article, let's start this tutorial.

1. Login Blogger Dashboard
2. Click Template >> Edit Html
3. Press Ctrl+F in Edit Html box and search this code ]]></b:skin> and place this code bellow ]]></b:skin>

<b:if cond='data:blog.pageType == &quot;static_page&quot;'> <b:else/> <b:if cond='data:blog.pageType != &quot;item&quot;'> <style type='text/css'> #main-wrapper {width:620px;padding-left:5px;padding-right:5px;border-right:1px solid #ddd;} h2.date-header, .jump-link, .feed-links, .post-footer {display:none;} #blog-pager {width:98%; clear:both;} .post {margin:.01em 10px 10px 0;background:none;width:260px;height:250px;float:left; border:1px solid #ccc; positon:relative;overflow:hidden;} .post-body {margin:0.2em 0 .75em;line-height:1.4em;font-size:13px;color:#111;overflow:hidden;} .post h3 {height:32px;font-size:12px;font-weight:bold;line-height:1.3em;color:#ffffff;text-transform:none;font-family:Arial; background-color:#3d85c6; text-align: center; padding-top:3px;} .post h3 a, .post h3 a:visited, .post h3 strong {font-weight:bold;color:#ffffff;} .post h3 strong, .post h3 a:hover {color:#000;text-decoration:underline;} .post h2{font-size:13px;font-weight:bold;line-height:1.3em;color:#000;text-transform:none;padding-bottom:5px} .post h2 a,.post h2 a:visited,.post h2 strong{color:#000} .post h2 strong,.post h2 a:hover{color:#444;text-decoration:underline} .post img { height:100px; width:100px; margin-top:5px; padding:1px;} </style> </b:if> </b:if>

Save template and done.

If you encounter this problem:

Problem: Just one column show up on homepage, how to fix?
Fix: change/resize this code value --> width:260px

Problem: Left and right columns are uneven?
Fix: this problem came from your heading modify. For example:
Default blogger heading is : h1 for title, h2 for date, h3 for post/article title.
If you modify this heading become: h1 for title, h2 for post/article title and h3 for date, so... you must change between h2 & h3 code above.

Problem: change color header box
fix: search this hexacolor at code above : #3d85c6 (blue)and change with your hexacolor code.

Good luck