Expandable Post Summaries for Blogger New Version

If your post is too long, then you think to cut some of your post. We can Expandable Post Summaries from our blog. Don't do it, because with few modification on yor layout, we can hide some post by the "read more" link. Note that you'll need to have post pages enabled in order to make this feature work and use XML blogger template.
And now let's do it .

Follow Step 1

1. After login with your Google Account to your blogger, lets go to Layout tab
   
2. Go to Edit HTML tab
3. After that, search } ]]></b:skin kode
4. Place this code following code after } ]]></b:skin

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

After that,add the following code under the code <p><data:post.body/></p>

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More...... !</a>
</b:if>

you can changes the blod text with your own like continue reading, etc

And save your work.


Follow Step 2
The final piece that we need is a little bit of code in your actual post. Each post that you want to use this feature on will need this code:

<span class="fullpost"> ... </span>

This part can actually go in the post template, if you don't want to have to type it for each post. You'll enter the summary text outside the span tags and the remainder inside, like so:

Do you wan to try this hack ? <span class="fullpost"> This hack is about Expandable Post Summaries on Blogger New Version</span>

Now, when a reader visits your blog, this post will appear like this:

Do you wan to try this hack ?
Read more!

When they click the Read more link, they'll go to the post page where they'll see the whole thing:

Do you wan to try this hack ?. This hack is about Expandable Post Summaries on Blogger New version.

That's all . I hope you can do this tutorial and happy blogging ... !

Related Posts by Categories

Widget by Hoctro | Jack Book |