Please backup your template just in case you screw up, it is very important to do, never ignore this so you just restore it back up when ever you need.
If you install this hack then the blog post preview feature of blogger is not going to work, it somehow conflicts with hiding the blog posts widget from homepage. However, I do not think anybody cares for this because you will already be previewing it in editor.
Remove Blog Posts from Home PageObviously, we need to remove the blog posts widget from the current blog home page so we can add another widget in its place to hold content as an actual new homepage. To do that, please open you blogger dashboard then navigate to the template designed (Dashboard > Template > Edit HTML) and search for
<div class='blog-posts hfeed'>then add above it this code:
<b:if cond='data:blog.url != data:blog.homepageUrl'>
Well, now we added an if condition tag and we need to close it at some point, please search again for
<b:include name='nextprev'/>then add below it:
Great, we are done with hiding the blog posts from our homepage, now we need to unlock the main blog widget so we can add a holder widget for the new homepage.
Unlock Main Blog Widget to Add New OneIt's very simple, just search for
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'>then change lock to
locked='true'instead of false. So, you just make it possible for the new widget to be added to the main blog section, now lets do it.
<h3 class="post-title entry-title" itemprop="name">Welcome!</h3> This is an example for a blogger website that has an actual home page and you can go to the the link for the blog <a href="/blog/">here</a> or from the navigation menu up there.<br /> <br /> <div class="about-me"> <h3 class="post-title entry-title" itemprop="name">About Me</h3> You can write any thing about yourself here (or change the whole code if you want). </div>
We also need to hide this homepage content from any page that is not supposed to have it, search for
<b:section class='main' id='main' showaddelement='no'>then add this code under the
<b:includable id='main'>of the newly added widget:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Again, we added an if condition tag and we need to close it at some point, please look for the
</b:includable>underneath then add above it:
Cool, now we are almost done, don't worry about the homepage code because you can change it later, we just need to make a custom redirect for the new blog URL which I will explain for you below.
Create Custom Redirect to Blog URLWe will redirect this link
you.blogspot.com/blog/to the home page hack link which is
you.blogspot.com/search?&max-results=5, please navigate to (Settings > Search Preferences > Custom Redirects > Edit) then paste these links accordingly to the dialog boxes.
Please create two redirects according to these information:
First Redirect:Dialog (1):
Second Redirect:Dialog (1):
Please change the red colored (5) numbers to how much posts you want to be shown at your blog for each page, and then save changes. Okay, from now your blog link is going to be
you.blogspot.com/blog/so you have to do necessary changes.
Create Custom Robots.txt FileJust for sake of SEO, you have to change your default robots file settings to adapt with the new changes of making a home page by changing the default blog url. So, go to (Dashboard > Settings > Search Preferences > Custom robots.txt > Edit) then paste this robots configurations:
User-agent: Mediapartners-Google Disallow: User-agent: * Disallow: /search/label Allow: /search Allow: / Sitemap: http://YOUR-BLOG-NAME.blogspot.com/sitemap.xml
Please make sure to change (YOUR-BLOG-NAME) in the code above to your actual blogger URL then proceed to the next and final step.
Add Blog URL to NavigationOf course, now you must add a your blog link which is
http://you.blogspot.com/blog/to the main navigation of your website, or anywhere you should depending on your site, and you will be done.
So what do you think about our homepage hack for blogger? Do not hesitate to post your thoughts and questions about this in the section below, I am ready to help!