How to Hide Posts from your Blogger Homepage Easily

Normally whenever you start a new blog, the default layout you get is like posts section on the left and sidebar on the right, so that's default and you can add more widgets to that sidebar section, but if you want to make your blogger blog pretty much like HTML website then you might need to hide that posts section so that you can add widgets on your whole blog and no posts will be visible.

So now you can easily do that by just adding some code in your default codes present in your blogger blog. So basically we are going to use those conditional tags to state that we do not need posts on homepage, so now check steps below.

Visit Blogger.com –> Template –> Edit HTML.
Now press Ctrl + F and search for below code.

 <b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>

Now just replace the whole code with below code adding those red conditional tags.  

<b:if cond='data:blog.canonicalUrl != data:blog.canonicalHomepageUrl'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</b:if>

Now press on Save Template button and refresh your blog.

That's it now your blog will nor have that posts section visible, if you want it back just remove those red conditional tags from the above code and you will have that posts section back on your blogger blog.
Update Another easiest way is using CSS, well this one was suggested by Sandy so thanks to him, just follow below steps.

Open Blogger –> Template –>Edit HTML.
Now press Ctrl + F and search for ]]></b:skin> tag & paste below code above it.

#main{display:none}

That's it now just Save Template and refresh your blog.