Create Static Pages in Blogger – Part 2

I recently wrote a post titled How to Create Static Pages in Blogger where I discussed one method of using posts to mimic static pages. One question that was asked involved removing the static pages from the post archives in Blogger. From what I have seen, you can’t prevent a post from being added to the archives, which would make all static posts appear.

Using my programming background, I decided to find a way to prevent the static pages from appearing in the archives. When experimenting with different methods, I finally came up with a method that works, as well as allows commenting on the static pages. This post explains how to create this type of static page.

Benefits of the New Method

In my first post about static pages in Blogger, I removed the ability to comment on a static page. This was the flag to Blogger that indicated the page was to be static and that the date shouldn’t be displayed. Now I know some may want to enable comments on certain static pages, so this method wasn’t going to work for them.

I went back to the drawing board and came up with another solution to the problem. The new solution has two benefits:

1. The new static pages allow comments (unless you disable this ability for the page).
2. The static pages will be removed from the Archives widget.

If this sounds like something you are interested in accomplishing, then read on. I do have to mention that there will be some editing of your blog’s template to make these static pages work properly, but I will try to walk you through the edits step-by-step.

Gathering Some Information

Before we begin, we will first need to grab some setting values from your blog. To find these values, use the following steps:

1. Log in to your Blogger account and then click the “Settings” link beside your blog.
2. Click the “Formatting” link near the top.
3. Beside the “Date Header Format” option you will notice the format used to display the dates in your post. Write down the date displayed so you know how the dates are displayed in each post. For example, the date displayed for my blog is “June 16, 2008″, which means that I will write down this date.
4. After you know the format of the date, let’s check the format of your archives. Click the “Layout” tab at the top of the screen.
5. Look for the “Archives” element in your layout and then click its “Edit” link.
6. Next to “Style” you will see three option buttons, with one of them selected. Write down the name of the selected option.
7. Beside the “Date Format” option, you will see the format of the archives dates. Write down the date you see displayed. For those that have selected the “Hierarchy” option record the value in the “Year” option.

For example, mine is displayed as “January 2006″ or “2006″ for the Hierarchy option, so I will write that date down.

8. Click the “Cancel” button to close the window.

Now, this part doesn’t require any setting lookup, but I just want you to think of a date that occurs in the year “previous” to your first post.

As an example, I have chosen “June 23, 2006″ as my date as this is exactly one year “before” I started Technically Easy. The steps I will outline below, will use this date. When following the steps below, you should use your own date instead of mine. From this point forward, all static posts should use this date.

Now that you have these two date formats and a date from the past, let’s get started on creating some static pages.

Creating a Static Page

So now we have the post date format, the archives date format, and a date that occured in the past before your first post. Let’s create a static page.

1. Under the “Layout” tab, click the “Edit HTML” link.
2. Let’s backup the template first. Click the “Download Full Template” link to save your current template.
3. Once the template is backed up, check the “Expand Widget Templates” checkbox to display the code for all elements on your blog.
4. Search for the following:
   <data:post.dateHeader/>

   This is the code that displays the date for each post.

5. Change that line of code so it looks like:
   <b:if cond='data:post.dateHeader != "June 23, 2006"'>
     <data:post.dateHeader/>
   </b:if>

   Keep in mind that you should insert the date you chose above instead of my date. Also make sure that the date is in the correct format, which was the first format you wrote down.

   The above line tells Blogger to only display the date in the post if the date of the post is not June 23, 2006.

6. Once you have inserted the above code, search for “BlogArchive”. This should bring you to your archives widget.

Changing this code is a little more complex. The reason for this is that you can display the archives a few different ways. This is where the archives option that you wrote down comes into play.

If you chose the “Flat List” archives, use the following steps:

1. Search for:
   <b:includable id='flat' var='data'>
2. Replace the entire includable section with the following:
   <b:includable id='flat' var='data'>
     <ul>
       <b:loop values='data:data' var='i'>
         <b:if cond='data:i.name != "June 2006"'>
           <li class='archivedate'>
             <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
           </li>
         </b:if>
       </b:loop>
     </ul>
   </b:includable>

Once again you will use your month and year chosen in place of mine. You will need to also ensure that the date is formatted the same as the your archives format you wrote down earlier. Since the date I chose was “June 23, 2006″, and my date format was “January 2006″, I would write my date as “June 2006″.

The above lines of code tell Blogger to only display the archive link if the archive date does not equal “June 2006″. Since I started my blog after June 2006, the only posts published in that date are my static pages.

If you chose the “Dropdown Menu” archives, use the following steps:

1. Search for:
   <b:includable id='menu' var='data'>
2. Replace the entire includable section with the following:
   <b:includable id='menu' var='data'>
     <select expr:id='data:widget.instanceId + "_ArchiveMenu"'>
       <option value=''><data:title/></option>
       <b:loop values='data:data' var='i'>
         <b:if cond='data:i.name != "June 2006"'>
           <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
         </b:if>
       </b:loop>
     </select>
   </b:includable>

Once again you will use your month and year chosen in place of mine. You will need to also ensure that the date is formatted the same as the your archives format you wrote down earlier. Since the date I chose was “June 23, 2006″, and my date format was “January 2006″, I would write my date as “June 2006″.

The above lines of code tell Blogger to only display the archive link if the archive date does not equal “June 2006″. Since I started my blog after June 2006, the only posts published in that date are my static pages.

If you chose the “Hierarchy” archives, use the following steps:

1. Search for:
   <b:includable id='interval' var='intervalData'>
2. Replace the entire includable section with the following:
   <b:includable id='interval' var='intervalData'>
     <b:loop values='data:intervalData' var='i'>
       <b:if cond='data:i.name != "2006"'>
         <ul>
           <li expr:class='"archivedate " + data:i.expclass'>
             <b:include data='i' name='toggle'/>
             <a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>
             <span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>
             <b:if cond='data:i.data'>
               <b:include data='i.data' name='interval'/>
             </b:if>
             <b:if cond='data:i.posts'>
               <b:include data='i.posts' name='posts'/>
             </b:if>
           </li>
         </ul>
       </b:if>
     </b:loop>
   </b:includable>

You will use your year chosen in place of mine.

The above lines of code tell Blogger to only display the archive link if the archive date year does not equal “2006″. Since I started my blog after 2006, the only posts published in that year are my static pages.

7. Once you have changed your archives section, click the “Save Template” button at the bottom to save your template.
8. If you receive an error, check the changes you made to ensure you closed all of your tags.
9. Now if you have previously created static pages, edit those posts and change the post date to your new date you have chosen.

Now whenever you publish a static post using the date you specified you can enable comments, and prevent the post from appearing in the archives widget on your blog.

This post was complex to write, so if you spot an error in my steps, please let me know and I will correct the error to avoid any problems in the future.

Summary

I had previously written a post that explained how to use posts as static pages in Blogger. The method provided in that post prevented comments from being displayed on that page as well as the page being displayed in the archives.

The method outline above allows comments in the post, as well as removes the post from the archives so the post acts more like a static page than an actual post.

Related Posts

How to Create Static Pages in Blogger
How to Create a Development Blog in Blogger
Blog Designing Tops for New Bloggers
Remove Navigation Links For Static Pages in Blogger