Sometimes you may download a Blogger Blogspot template which does not display the date header above the post title. I recently struck a free Blogger template like this and it took some time to find the right part of the template to fix the date. Plus the answer was not as far as I could tell listed in Blogger help. So to help anyone desperately struggling to find the solution to this problem I have decided to share this information in this article.
To Display the Date Header Above Post Title
1. Log in to Blogger
2. Go to Layout > Edit HTML
3. Back up your template before attempting any changes
4. Type the following into the search box (CTRL + F) to find the block of code beginning with this line:
<data:adStart/>
5. Paste the following lines of code
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
into the code block as shown here:
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</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>
<data:adEnd/>
</div>
7. Click the Save Template button
8. View Blog to see the date above the header
Today's Blogger Blogspot tip has shown you how to add the date above the post title on a Blogger Blogspot blog. The date above the post is often missing among slightly older Blogger templates but thankfully the fix is fairly easy.
Related Articles
List of Blog Know How Tutorials for Blogger Blogs
5 comments:
You're a legend!
Thanks Deborah-lee not an easy fix to find. Glad you enjoyed it!
I couldn't find the first code you wrote. Is there any other way out, I use a third party template
Hello EDi TWeaks. I had a look at your template and I see that no date is showing. Assuming you want the date. Try finding the following line:
h2.date-header{margin:1.5em 0 .5em;display:none;}
and removing display: none
which is preventing the element from showing up.
Thank you!!! This is the first tutorial that worked on me and I already thought it's impossible lol :D
Post a Comment