On About Read More on Your Post, we talk about the function of Read More. Here, I try to show you some steps to make it. I got this steps from a website a long ago, but the site cannot be accesed somehow. I hope this works well for you.
1. Log in to your account at blogger.com and then go to Template > Edit HTML. After that you will asked not to change the CSS code except for advanced users. We assume that we are advanced users and choose proceed.
2. Before adding new code, checked the checkbox of Expand Widget Templates.
3. Look for this code </head> and then copy this code below and paste it right above </head>.
<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>
4. Use Ctrl+f to search this code <data:post.body/> or <p><data:post.body/></p> and change it with this code below.
<b:if cond='data:blog.pageType != "item"'> <div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>"); </script> <span class='rmlink' style='float:right;padding-top:20px;'> <a expr:href='data:post.url'>»»  Read More...</a>
</span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
5. Save your Template and you post will be added by Read More automatically.
Note:
The blue text can be changed as your will.
--> summary_noimg = Article's height cutoff without images
--> summary_img Article's height cutoff with images
--> img_thumb_height = image's height to be showed on summary
--> img_thumb_width = image's width to be showed on summary
--> Read More... = can be changed READMORE HERE ...