Aug 28, 2012

How to Add Read More to Blogger and Change Read more Text

The Blogger Home page lets you set the amount of Posts you want displayed - I've set mine between 7 to 10. if the full content of the 7 posts is displayed on the Home page, it might reduce page load speed.
That is why every blogger i know uses the Blogger Jump Break Feature.


What is Blogger Jump Break?

New to Blogger? - The Jump Break shows part of your post excerpt (first paragraph or where ever you insert the Jump) on the front page and adds a "READ MORE >>" text for your readers to Click to see the full content.

Blogger Jump Break Inserted.

The Image above show my Jump Break added just under the "What is Blogger Jump Break?" subheading.
The dotted Lines beneath is the Jump Break - The lines are not visible in the post.

How to Change the Default Blogger "Read More >>" Text

You might prefer using "Continue reading.." or want to change the alignment of the Read More text? or even want it replaced with an image. - Here's How:
  1. Login to Blogger Dashboard, Layout >> Edit Post Body


  2. If you would Like More customization options then Go to Template > Edit HTML > Expand widgets and find this code: <data:post.jumpText/>
  3. Replace it with   
    <P> Continue reading... </P>
  4. Save changes and View your Home page.

    Other Edits:
    I didn't just add the Continue reading... - I Aligned it to the center and also made it a little Bold with this code:   
    <p align='center' ><strong>Continue reading...</strong></p></a>
To replace the Read More with an Image Button:
Find this code: <data:post.jumpText/>
Replace it with this: <P> <img src="image direct link"/></P>
Note: Replace the text in Red with your re-sized Button image URL


That's it Folks - Happy Blogging

1 comment:

  1. Hi, please how do i add ''how many people commenting'' and ''say something'' using css

    ReplyDelete