Setting a Static Front or Main Page in Blogger - Google Classic Blogger Template Structure and Code
(Page 2 of 4 )
The Classic Blogger template is dynamically driven. There is only one file that controls all of the pages. This is called a "template." If you are using Classic, you can access the template file by navigating to Google Blogger control panel then Dashboard and click "Template." The source code inside the template controls the creation of pages in Blogger. We will edit this template in such a way it will able to provide static home page content.
There are basically three important template tags that we need to learn before we can edit the template. These template tags are conditional tags, such as:
<MainPage>........... </MainPage>
<ItemPage>........ </ItemPage>
<ArchivePage>........</ArchivePage>
The first tag, <MainPage>........... </MainPage>, is used when we need to show or display the content only on the home page/front page. The information contained between these tags will not be shown in the post or archived pages.
The second tag, <ItemPage>........ </ItemPage>, is used to display information only on the post pages. The content displayed within these tags will not be shown on the main page or front page.
Finally the third tag, <ArchivePage>........</ArchivePage>, is used to display information only on the archived pages. Content within these tags will not be displayed on the main page or front pages
Below are the sets of instructions in the default classic template that we will need to alter to display front page content:
<!-- Begin content -->
<div id="content">
<!-- Begin main column -->
<div id="main">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<p>
<$BlogItemBody$>
</p>
</div>
<p class="post-footer">
<em><$I18NPostedByAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><span style="text-transform:lowercase"><$I18NNumComments$></span></a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links"><span style="text-transform:lowercase"><$I18NLinksToThisPost$></span></a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
Above is a particular section of the Blogger template that deals with the post or content. The next important section is this one:
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
The above code is for an html table (div) that displays the actual content written by the author. Another template tag that is important:
<$BlogItemBody$>
This is a command in Blogger that returns the content of the post. Also:
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
The above deals with displaying the dates of the post somewhere near the title.
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
The above section deals with displaying post titles in H3 tag above the post body.
Using the above principles of template tags, we can formulate our changes as follows:
We will use the <MainPage>........... </MainPage> to set a condition for some particular content to show only on the main page (home page). If the visitor clicks the post page, the post content will be shown, not the main page content.
The main page content is not post content, so it won't show in the post sidebar to display the title.
The post content is independent of the main content; if a new post is created, it will not be shown in the main page. Instead it will be shown only in the sidebar.
The archived pages simply show a link to the articles written on that specified date. This is very useful for making all post pages as crawlable as possible in search engines. The primary reason is that Blogger will only display the 10 most recent posts in the sidebar; posts beyond that will not be shown.
We will not show the post title and footer in the home page, as it is immaterial. The home page content is meant to be static and will not need a blog date, post title and post footer information.
Next: Formulating the Code to Edit the Template >>
More Blog Help Articles
More By Codex-M
