Expandable Posts Hack in Blogger

Post views:

Expandable Post summaries are widely used today in every blogs. Using expandable posts or Read More links to blog posts would make your blog more visitor-friendly! This post explains how to add expandable post summaries to Blogger blogs.

Please Note: Before Editing your Template, Save a copy of your current template by clicking 'Download Full Template' in 'Edit HTML' page of the Blogger 'Layout' Window and 'Preview' the changes before Saving.

Do the following steps:

1. Go to Blogger Layout - Edit HTML - and click Expand Widget Templates
Add Expandable Posts Hack in Blogger!

2. Search(Ctrl+F) for:

<div class='post-body'>

and paste the following code just after the above line:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

3. Again search(Ctrl+F) for:

<p><data:post.body/></p>

and paste the following code just after the above line:

<a expr:href='data:post.url'><i><p align='right'>Continue Reading...</p></i></a>
</b:if>

4. Finished! Just remember to add these codes in your blog posts:

(beginning of your post i.e., summary)
<span class="fullpost">
(remaining part of your blog post)
</span>

CSS Credit: Blogger Help and Hackosphere

HAPPY BLOGGING!

You may even like these posts