As seen on Blog From Scratch, I have a limit of ten posts on the front page and all of them contain only a thumbnail (image) and a small section of each post (introduction), and if the readers are interested in reading they would click on the Continue Reading link and read the entire post, of course, you could read my full posts directly from RSS Feeds or from Email but some people prefer reading it on the main blog.Why should you use the Read More feature?
- Shorter homepages instead of it having full of complete posts.
- It helps you organize up your posts.
- It makes the reader interact by clicking a button instead of doing nothing but reading.
- A longer stay on your site. (More Traffic, Lower Bounce Rate)
Especially if you have a 3000 words+ massive awesome complete guide in making money online or something like that and it's published fully on the homepage, the readers are not going to like it.
The Read More feature is called Jump Break on Blogger and it can be easily added to your posts with a click of a button without having to edit your HTML codes. (You have to do it individually for each post though)
1. Go to a post that you want to add the feature to
Find the section or introduction you want to only show on the homepage and give it an empty line between it and the next block of text (or image), as shown in the picture above.
2. Click on the Insert Jump Break toolbar icon
Click on the icon and a gray colored line or jump break will appear at where you have last selected in your post. The Read More link will appear at the end of your paragraph when you see it on the homepage. (Shown below)
 |
| Homepage |
If you press the Read More button you will be directed to the actual post.
This feature could also be easily done in the Edit HTML mode by inserting a small line of code as shown in the picture below.
If you would like to change the words "Read More" into something else you could do that by going to Design/Page Elements/Edit Blog Post (at the bottom right corner of your post widget), then change the Read More text into whatever you like.
For some custom templates you have downloaded elsewhere, you may to need to do a little editing in the HTML template.
1. Go to Design/Edit HTML/Download Full Template
Backup your template just in case something goes wrong.
2. Click on Expand Widget Templates
Press Control+F and search for
<data:post.body/>
Then add this following code directly beneath it:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >
Click save and you're done!
Have a good day! :)