How to add read more to blog

Sometime you want to add a read more function to your blog home page because it doesn't look cool if you only have one (few) posts on the home page. and when visitors first time on your blog, they just only see your very single post land (if your post is too long). Does it look right to you? Actually, there are quite a few tutorials out there where you can learn to add the read more function to your blog. But in most of them, you have to use the tag < span class = "fullpost" > < / span > every time you write a blog article. It's quite inconvenient, isn't it? Therefore, today I will show you how to add read more to blog just by one click. Just follow the instruction below:

1. You're in draft.blogger.com, go to template (on the lower left side-bar)


2. Scroll down to the end > > backup/restore template > > download full template


3. Click on edit template > > tick theExpand widget templates box


4. Press CTRL + F and type "]] > < / b: skin >"


5. Just right above it, copy and paste this code:



/ * 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 the]] > < / b: skin > and < / head >:



< b: if cond ='data: blog.pageType! = & quot; item & quot;'> < style > .post body img {img {max-width: 100px;}}     width: expression(this.width > 100? 100: true);     float: right;     } < / style > < / b: if >



7. In the search box, type "< data: post.body / >"or"< p > < data: post.body / > < / p >" if you use custom template


8. Place right below this code < data: post.body / > or < p > < data: post.body / > < / p >



< b: if cond ='data: post. hasJumpLink' > < div class = 'jump link' > < span style ='float: right; font-weight: bold;'> < a expr: href ='data: post.url + & quot; #more & quot;'> < span > < expr a: href ='data: post.url + & quot; #more & quot;'> read more & gt; & gt; < /a > < / span > < / a > < / span > < / div > < / b: if >



9. Click SAVE template


10. To add read more: just after your introduction paragraph, click on the 'break' icon located above the content box like this.

If you can't follow the instruction, just leave a comment below. I will sort it out for you. Best luck!
Thank you for dropping in this blog and reading my tip.