Now, I am going to share it with you. ;) There are 4 steps to follow in editing the template and 1 step when posting. But before you do anything, back up your original template, ok?
Template changes.
1. Copy and paste this code on the CSS declarations. That is between the <style></style> tags.
<style>
....
...
<MainOrArchivePage>
span.fullpost {display:none;}
</MainOrArchivePage>
<ItemPage>
span.fullpost {display:inline;}
</ItemPage>
</style>
2. Copy and paste this code just after the style closing tag (</style>):
</style>
<script type="text/javascript">
var memory = 0;
var number = 0;
</script>
3. Copy and paste this code just after the <$BlogItemBody$> tag.
<$BlogItemBody$>
<MainOrArchivePage>
<script type="text/javascript">
spans = document.getElementsByTagName('span');
number = 0;
for(i=0; i < spans.length; i++){
var c = " " + spans[i].className + " ";
if (c.indexOf("fullpost") != -1)
number++;
}
if(number != memory){
document.write('<br /><a href="<$BlogItemPermalinkUrl$>" title="permanent link">Continue reading "<$BlogItemTitle$>" here...</a>');
}
memory = number;
</script>
</MainOrArchivePage>
4. Republish your blog.
Now, after republishing your blog, it is now set for Continue Reading Here kind of post. All you have to do now is to edit your post to mark which part of your post to be hidden. Here is how to do it.
Open a blog post in Edit HTML mode. To mark the part that you want to hide, simply put those part between <span class="fullpost"> </span> tags.
Example:
Example Post
This is an example post. This one is displayed on the main and archive page. <span class="fullpost">This part of the post is hidden and can be viewed only on the permalink page.</span>
This is how the post will look like on the main or archive page:
Example Post
This is an example post. This one is displayed on the main and archive page.
Continue reading "Example Post" here...
The permalink page will contain the full post. For comments and suggestions, don't hesitate to contact me ;)
That's all!
