How to put add read more button for blogspot

Without read more facility your blog homepage will be within only two or few posts.when readers reading posts in your blog they can't find other posts easily.so after you add read more button for your blog you can see there are more posts on your blog homepage.the one method is use the tag <span class ="full post"></span> every time you write a blog post.
But it is not need now.there is a easy way to add read more button to your blog.
Follow the instruction.

1. Go to blogger dash board  here , and go to template
2. before change anything on template firstly backup the template using Backup/Restore Button
3. Click on edit template >> expand widget template
4. Press Ctrl+F and paste the code in the search box 

]]></b:skin>
    5. copy and paste the following code above that

/*READ MORE*/ .jump-link a { background: #ffff00; padding: 3px; color: #fff; } .jump-link a:hover { background: #000000; padding: 3px; color: #ccc; }
 6. Place this code between ]]></b:skin>  and  </head>

<!--READ MORE--> <b:if cond='data:blog.pageType != "item"'> <style> .post-body img { img { max-width: 100px; width: expression(this.width > 100 ? 100: true); float: right; } </style> </b:if>
7.If you can't find  ]]></b:skin> ,find  " <data:post.body/> " or " <p><data:post.body/></p> " 
 And paste that below code below on of   that code

<!--READ MORE--> <b:if cond='data:post.hasJumpLink'> <div class='jump-link'> <span style='float:right; font-weight:bold;'><a expr:href='data:post.url + "#more"'><span><a expr:href='data:post.url + "#more"'>Read more >></a></span></a></span> </div> </b:if>
8.Save the template.
9.To add read more while your post writing after the introduction paragraph or after the paragraph you want you want  to show on the homepage click on the "break" icon located above  the content box.
See below picture