Blogger Trick: How to make Read More

Go to my homepage, or click here. You will see half Post and "read more" link. I create "Read more" to save space on the my homepage, and give you a more space to choose what Post you wanna read. Look's good don't you? Perhaps you have seen many website or weblog use that. You wanna make it for your blog? If yes, I'll tell you a blogger trick how to make read more. Ready?

Let's follow these steps:

⇒ Please Login first with your Blogger Account

⇒ Go to Layout Tab

⇒ Click Edit Html

⇒ Click Download Full Template first before you touch your html code.

Warning! It's very Important. Frequent errors in the edit html code. If an error occurs and you become a damaged template, you only to upload it from your computer. So, do back up before you edit your blog's html code.

⇒ Check the Expand Widget Templates box


⇒ Find this code on your html code:

<div class='post-body'>


⇒ To easy find, you can use Ctrl+F, then paste that code you wanna find on the box, click Find or Next


⇒ Copy this code, and paste under <div class='post-body'>:

<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;}</style>

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

<b:else/>

<style>.fullpost{display:none;}</style>


⇒ Then find this code:

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


⇒ Copy this code, and paste under <p><data:post.body/></p>:

<a expr:href='data:post.url'>Read More......</a>

</b:if>

⇒ Save Template


Take a rest for moment. . .


⇒ Go to Setting Tab

⇒ Click Formatting

⇒ Copy this code, and Paste on the box:

<div class="fullpost">


</div>

⇒ Click Save Setting





Now, let's try the post:

⇒ Your Post have

<div class="fullpost">


</div>


⇒ Your Post example:

This is post that you wanna show on your homepage
<div class="fullpost">
This is post that you wanna hide on your homepage. And will show if visitors click the Title Post or click read more.
</div>

⇒ Publish Post


Let's see the result. If failed, don't give up. Please try again and Good Luck. See you in the Next Post.