Adding Read more in Blogger posts is pretty difficult compared to WordPress . Since we don’t have a more tag on Blogger, we need to implement a template hack for getting this done.
Open Edit HTML from blogger Layout section and expand widget templates .
Copy this JavaScript code and paste it before </head> in your Blogger template code . Now , press Cntrl+F and search for <p><data:post.body/></p> . The block of codes found near to the above line usually looks as shown below .
<div class=’post-body>
<p><data:post.body/></p>
<div style=’clear: both;’/> <!– clear for photos floats –>
</div
You have to edit them as shown below to add read more in Blogger posts .
<div class='post-body' expr:id='"post-" data:post.id' > <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> <span id='showlink'> <a expr:href='data:post.url'>Read More......</a> </span> <script type='text/javascript'> checkFull("post-" "<data:post.id/>"); </script> </b:if> <div style='clear: both;'/> <!-- clear for photos floats --></div>
Make sure that the codes(in orange) above <p><data:post.body/></p> are added just after <div class=’post-body’ (or you have to find a similar one in your template) .
Now the template part is over and the next task is to add read more in Blogger posts. Save the template and return for a new post .
This is the part above read more
<span id=”fullpost”>
Here goes Read more ..
</span>
So when each time you blog , insert <span id=”fullpost”> and
</span> in “compose” to access read more into your Blogger posts .
Update : Blogger team added expandable post option in Blogger blogs .
Tags: Blogger tricks, expandable posts in Blogger, read more in blogger posts
How i add read more image in place of read more