Friday, September 23, 2016

How to Add Jump Break in Blogger

Jump Break is the out of box feature provided by Blogger to implement the "Read more" links on the blog's index page. Bloggers have been implementing "Read more" link(jump break) manually by editing their HTML which is complicated and error prone process.

With Jump Breaks, we could show just a snippet of our post on our blog's index page(home page) rather than showing the whole post content. Now a days, this is becoming a latest trend.

Why one should use Jump Breaks? 

  •  Speed up our page load time
  •  Visitors see a selection of our posts without the need to scroll
  •  Helps us to reduce the bounce rate of our blog - Visitors now have to click on the read more link to view the whole content.
  • Increase our page views

How to insert Jump Breaks in Blogger?

Adding jump breaks in our post is very simple and it could be achieved in two ways:
  1.  Using Inset Jump Breaks Icon present in editor's toolbar
  2.  By adding <!-- more -->  in HTML mode 

 Using Inset Jump Breaks Icon present in editor's toolbar

  • Sign in in our blogger account
  • Go to Post Editor (Blogger >> Edit Post )
  • Place the cursor in the content area where one would like to add the Jump Breaks
  •  Locate and click the "Insert jump break" icon present in the editor's toolbar
The "jump break" will be inserted into our blog post at our cursor's position.

By adding <!-- more -->  in HTML mode 

If we don't want to use the new post editor, we can still insert a jump break in HTML mode by adding <!-- more --> where we want to position the jump break.