Wednesday, March 7, 2007

Let's Make "Read More"

Yesterday, Iwan's blog was broken. Its because he wanted to add "read more" facility in his blog, but he get difficulty and get stress. And mas Aries and Iwan wanted me to take resposiblity. It doesn't make sense :). Therefore, I decide to share how to add read more in blog to make our blog more simple and interesting. The steps bellow is for blogger beta version. Let's Try ....

First Step :
1.Open template --> edit HTML
2.Give check in "expand widget template"
3.Find this code :

<div class='post-header-line-1'/> <div class='post-body'>

4.Write this code bellow the code above.

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


5. After code above, You can find this code
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


6. Between <p><data:post.body/></p> and
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Please write this code :
<a expr:href='data:post.url'>Read More......</a>
</b:if>


7 Please check again the code structure :

<div class='post-header-line-1'/> <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>

<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>
</b:if>

<div style='clear: both;'/> <!-- clear for photos floats -->
</div>


8. Click SETTINGS, and choose FORMATTING. Please find POST TEMPLATE menu. Fill the box with this code :

<span class="fullpost">


</span>


Don't forget to click SAVE
9. Place your article above the code, and place the another between
<span class="fullpost">
</span>

GOOD LUCK!!!

No comments: