I have written a bit of JavaScript and Blogger.com code just for this. You just need to copy the following code in the right places of your template and it will render a link to the previous post after the fixed number of posts on the main page.
Copy this chunk to the <head> section, preferably after the bunch of <meta> tags. Replace the number "3" in the line that contains "nMaxPostsOnMainPage" to the fixed number of posts on your main page, if it is not 3.
<script type="text/javascript">
// This JavaScript code created by Teng-Yan Loke
// Date: 7 Nov 2006 1119hrs
// Website: http://glob.lokety.com
// E-mail: lokety-at-gmail.com
var nMaxPostsOnMainPage = 3;
var aPosts = new Array(nMaxPostsOnMainPage + 1);
var n = 0;
<BloggerPreviousItems>
if (n <= nMaxPostsOnMainPage)
{
aPosts[n] = "<$BlogItemPermalinkURL$>|<$BlogPreviousItemTitle$>";
n = n + 1;
}
</BloggerPreviousItems>
function writePrevPostOnMainPage()
{
var sTmp;
sTmp = aPosts[nMaxPostsOnMainPage].split("|");
document.write("<a href=\"" + sTmp[0] + "\">" + sTmp[1] + "</a>");
}
</script>
// This JavaScript code created by Teng-Yan Loke
// Date: 7 Nov 2006 1119hrs
// Website: http://glob.lokety.com
// E-mail: lokety-at-gmail.com
var nMaxPostsOnMainPage = 3;
var aPosts = new Array(nMaxPostsOnMainPage + 1);
var n = 0;
<BloggerPreviousItems>
if (n <= nMaxPostsOnMainPage)
{
aPosts[n] = "<$BlogItemPermalinkURL$>|<$BlogPreviousItemTitle$>";
n = n + 1;
}
</BloggerPreviousItems>
function writePrevPostOnMainPage()
{
var sTmp;
sTmp = aPosts[nMaxPostsOnMainPage].split("|");
document.write("<a href=\"" + sTmp[0] + "\">" + sTmp[1] + "</a>");
}
</script>
Place this line just after the </Blogger> tag near the line that has the HTML comment "End #main". If you want to apply any CSS style to the line, specify it in the <div> tag.
<MainPage><div style="">Previous post: <script type="text/javascript">writePrevPostOnMainPage();</script></div></MainPage>
Save the template and publish your site. It should work now.
Note: avoid using "|" in the title of your posts as it is used programmatically in my code.
I can probably expand this code to:
- display a specified number of previous posts, instead of just one
- display a dropdown list of previous posts to quickly jump to any post
Update (December 13 2006): I've made some enhancements to this stuff. Click here to see the next post.
Technorati Tags: blogger, blogger.com, blogger tip, blogger code, previous post, main page, template tip, list of posts
No comments:
Post a Comment