Add "read more" in Blogger

Usually Blogger shows the whole post on main page by default. It is quite annoying, especially when I post a long document describing something like Samba configuration.

I searched the internet for solution of showing the start of post on main page. Some were quite good, but still not perfect when dueling with the customized pages. That is the reason for me to write this solution:

Point to Design | Edit HTML. Check Expand Widget Templates.

Inside the HTML box, there should be a line like

<data:post.body/>

replace this line with

<b:if cond='data:blog.pageType != "static_page"'>
    <b:if cond='data:blog.pageType == "item"'>
        <style>.fullpost{display:inline;}</style>
        <data:post.body/>
    <b:else/>
        <style>.fullpost{display:none;}</style>
        <p><data:post.body/>
            <b:if cond='data:post.url'>
                <a expr:href='data:post.url'>More ...</a>
            <b:else/>
                <data:post.title/>
            </b:if>
        </p>
    </b:if>
<b:else/>
    <data:post.body/>
</b:if>

Then save this template.

Point to Setting | Formatting . Add this line to Post Template:

<div class="fullpost"></div>

For each post, the "more" part should be enclosed within the div shown above.