Since I wrote the post titled Create Static Pages in Blogger – Part 2 I have been asked on numerous occasions about hiding the static page from the homepage or main page. For blogs without many posts, the static pages may appear on the homepage when someone visits the blog.
It isn’t hard to hide static pages on your blog’s homepage, but it does take a bit of coding, much like it was to create the static page. In this post, I’ll explain what you need to change to prevent the static pages from appearing on the homepage of your Blogger blog.
Hiding the Static Pages
As you may know, static pages are regular post pages, but the code within the template causes them to look different when displayed. Since they are regular posts, they could show up on your blog’s homepage.
To prevent them from appearing, you can use the following steps:
- First, if you haven’t already done so, create a static page by following the steps outlined in Create Static Pages in Blogger – Part 2.
- Once you have created a static page, make a backup of your current template before proceeding.
- Next, open your template in the HTML editor within Blogger. We will be editing the HTML, so we will need to work in that editor.
- Click the “Expand Widget Templates” checkbox to ensure all the code is displayed.
- Using your web browser’s “Find” feature, search for the following:
<b:loop values='data:posts' var='post'>
This is where Blogger will loop through the posts that will be displayed on each page. For individual post pages, only one post will be shown, while a homepage will have many.
- Now comes the tricky part, replace the following lines of code:
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<p class='date-header'><data:post.dateHeader/></p>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond='data:post.trackLatency'>
<data:post.latencyJs/>
</b:if>
</b:loop>with these lines of code:
<b:loop values='data:posts' var='post'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.dateHeader != "June 23, 2006"'>
<b:if cond='data:post.dateHeader'>
<p class='date-header'><data:post.dateHeader/></p>
</b:if>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:if cond='data:post.dateHeader != "June 23, 2006"'>
<b:if cond='data:post.dateHeader'>
<p class='date-header'>
<data:post.dateHeader/>
</p>
</b:if>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:post.dateHeader != "June 23, 2006"'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
<b:if cond='data:post.trackLatency'>
<data:post.latencyJs/>
</b:if>
</b:loop>Note:
Remember to replace the date and format shown above with your own or this code won’t work properly.
- Click the “Save Template” button at the bottom to update your template. If there are no errors, view your homepage to ensure your static pages are hidden.
How the Code Works
For those interested, here is what the actual code is doing:
Blogger begins to loop through the posts using this line:
Next, we check to see if current page (data:blog.url) is the homepage (data:blog.homepageUrl) with this line:
If it is, we then check the post date to see if it doesn’t match our static page date. Also, if you created more than one static page, we must include a date check, since other pages after the first page for a date don’t have a date header associated with them.
<b:if cond='data:post.dateHeader != "June 23, 2006"'>
If the date doesn’t match, then we display the post on the page:
<data:post.dateHeader/>
</p>
<b:include data='post' name='post'/>
If it is a static page, then we don’t display it at all. The remainder of the code displays the post or static page for all other pages on the blog.
That is all that is needed to hide static pages from the homepage in a Blogger blog.
Related Posts
Create Static Pages in Blogger – Part 2
How to Hide the Posted By Line in Blogger
Remove Navigation Links For Static Pages in Blogger
i just could try it out in a hurry (i’m @work right now
), but the only thing happend was, that on the main page only 3 postings apperad (instead of 
– on the second page (“older posts”) everything’s displayed normal, but also the static page is listed there…
back @home, i just tried again (several things – your modified code, changing the code line by line), but in both cases happens as follwos:
on the first/homepage all postings disapear, which have no own date-line (i.e. all those, that have been publishes on a same day), on the second page all posts are still existent (also those with no date-line), inkl. the static page.
if that may help…
Did you include the following on your homepage in your template:
<b:include data='post' name='post'/>? This is what displays the posts.yes, i did, since i just pasted your abovementioned code…
Can you send me your full template code and I’ll have a look?
when i use the XML-file you sent me (thx a lot), not only the static pages won’t disapear, but also many of the posts are displayed doubly.
LOL mysterious….
Interesting. When I tested the template I didn’t see double-posting. The post information is displayed at the
<b:include data='post' name='post'/>line. If this is repeated twice for any post then a post will be displayed twice.Thank you so much for taking the time to post these extremely helpful tips! I think you do an excellent job of explaining the process and make it easy to understand. I am having an issue with this code however. When I put the code in my blog still publishes the pages and also adds back in the post date which I removed in an earlier step. Any idea what I am doing wrong? Thanks again for your help!
Okay I figured out my initial problem (I forgot to put in the day of the week!) but now I have another problem. All of my new posts show the date twice in the posting. This did not happen before I added this code. Any suggestions?
It depends on your code. You may have
post.dateheadercalled twice which will dispay the date twice, or you may have forgotten to close an if statement.[...] in BloggerBlog Designing Tops for New BloggersRemove Navigation Links For Static Pages in BloggerHiding Static Pages from Main Page in Blogger « How to Display HTML Code in Blog Comments How to Reset the Linksys WRT160N [...]
Thank you so much for helping us that are less than technologically savvy. I’ve been trying to hide my static page using your method to no avail. The majority of text that you state that I should replace is not anywhere in my template all in one place. Just bits and pieces of the text scattered in different sections. Can you help me?
Please check my blog …..I would like to be able to click on one of the menu tabs (Memories, Recipes, etc.) and post directly to that page.
What coding do I need? And, where do I put it?
Thanks much for your help!!
hello paul.. i have following issues with my blog:
1) i used this hack on my blog but when I click on “Older Post” then my static pages are also shown as posts.
2)Also when I click on “Older Posts” then the posts starts appearing with comment box below each post.
3) I am not able to add page navigation in my blog.
Please have a look at my blog to see the problem, You are my only hope, please help me with these issues..
Can you send me your template, using the contact form in the top navbar, and I’ll fix it up for you.
hi paul,
i have sent u my template.. thanks
hello paul,
you are gem of a person always ready to help others out. Heartfelt thanks for that.
thanks a lot for changing my template to my requirement.
i had an issue. i wanted to display post titles only on archive and labels page, but from 2nd page onwards it displays only titles and not textx. i want “titles+text” in all pages and “only titles” in labels and archive pages. can you show me a way around please ?? sorry for troubling you again and again.
That may not be possible because of how Blogger labels the pages. For the labels, archive, and home pages, the page type is “index”. This means that when you specify pageType == “index” in your code, it applies to all three types of pages.
I’m not sure if there is an easy way of distinguishing one from another, but I’ll see what I can find. In the meantime, you may want to display the title in content on the pages to avoid any issues.
Hi there – I am a new blogger trying to cobble together my blog, and hoping someone can help! I used the backdating method (and forward dating for the home page) to make static pages linked to a navigation link bar under my header.
However, I am baffled as to how to make the “journal” link I made connect to regular blog posts I upload. I made a normal blog post and noticed it exists in the edit posts list, but I don’t know how to get it to load on the ‘journal’ page.
I am probably just doing something really stupid….but can’t see it.
Please have a quick look and help if you can?
I don’t think that is possible within Blogger’s code, probably Javascript can do it, though, but I haven’t looked at that option. The reason for that is how Blogger displays posts. When you display your homepage, Blogger allows you to loop through several posts to display on that page within the blog gadget. The number of posts depends on the settings in your blog.
When a post is displayed, only that post can be displayed by the blog gadget, which is why you can show multiple posts within a single post.
Hmm, so just to clarify – if you make your ‘home page’ into a static page, there really is no way to have any of the links then connect to a page that functions as a ‘normal’ blog….?
I saw somewhere, where someone was actually able to make a “posts” link in their navbar – but haven’t been able to find out how. Though I will try and find a workaround by tweaking the settings.
Also, I didn’t realize were were able to add javascript to blog template code… I’ll look into that too.
Thanks very much in any case.
After I left my last comment I thought about it for a moment. Technically there is a way to display your recent posts on a post page. It involves something like the following:
1. Create a post to display the a list of your recent posts, as you have already done with your “Journal” post. Don’t include any content, only the title.
2. Next add a “Feed” gadget to your template, right below the blog post gadget. For the feed URL, use your blog’s RSS feed.
3. Next edit your template’s HTML, and surround the code in the Feed gadget with something like the following:
<b:if cond='data:blog.url != "http://www.faeriesunrise.com/2009/12/journal.html"'>This will cause the code in the feed gadget to only display on your journal page. If you have some difficulties, just let me know, and I’ll create a post on how to do this.
I’ve been working on the blog all day today – and after pondering about 4 workarounds, I actually did this:
Created a separate blog (with related title), changed the main-wrapper area so that it’s blank and can function as a template for a, gallery page, etc – without showing any sidebars (wouldnt want those pages to look like a blog).
Then, dumped the ‘home’ link in favor of making the “home” page BE the blog, and tie links together.
If I knew more about blogging I might be able to anticipate problems with this setup but for what I need for now it suffices.
The idea you posted is a good one – if I hadn’t already put so much work into it today I might have tried that!
In any case – I’m glad I came across your site, you’re very helpful to everyone and its very appreciated. I know my site has nothing to do with computers but I may post a link in one of my posts to your site as a thanks, if it’s ok.
Cheers for now, tytyty!
Thank you for your excellent instructions and explanation! I made all the changes and worked through the error messages – however, I am unable to find the issue with the message below. Body has been followed by . Please assist.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The element type “body” must be terminated by the matching end-tag “”.
Sorry – element type “body” has been followed by
I left a comment before, but it didn’t get responded to.
Thank you so much for helping us that are less than technologically savvy. I’ve been trying to hide my static page using your method to no avail. The majority of text that you state that I should replace is not anywhere in my template all in one place. Just bits and pieces of the text scattered in different sections. I’m able to hide the static pages a little because they’re not on the main page, but I’m trying to hide them completely. Meaning, if someone clicks on “older posts”, they won’t see the static pages. Can you help me?
I haven’t played around with preventing the static pages from appear if some clicks the older posts link. I may be able to do it from a post page, but from an index page, it may not be doable.
I’ll play around with it and see what I can do.
Michelle – while I was searching around for info on static pages myself, I came across a post that says you can set the date forward in time (say, 10 years) in order to trick the blog and keep it from archiving.
Don’t know if that’s what you needed, but hope maybe it helps? Otherwise I’d just keep trying the google search. Good luck…
T. Larking – thanks for trying to help. Unfortunately, that’s not what I’m looking for. What I’m looking for is that my static pages not being seen anywhere on the blog except for the specific link that leads to it. Basically, my static page is a FAQ page. Although, I have it set so it doesn’t show on the archive list, if you click on “older posts” you’ll eventually see it. If I use your suggestion, the post remains on the main page because the date is set in the future, although I can hide the datestamp.