In this Blogger tutorial you will learn how to insert jump breaks into your Blogger posts as an aid to quick navigation for your visitors. Jump Breaks in Blogger provide an easy way to show only a snippet of your whole post on the home page of your blog with a read more link below it for the rest of the story. The advantage of adding jump breaks to your Blogger posts is that your most recent posts for what interest them rather than having to scroll through a whole bunch of long articles. This is definitely a big help for those of us like me who often write articles longer than 500 words. If your posts are short and sweet you may find adding this read more features is unnecessary however you can still apply it when you do have a longer post. Below is an example post which illustrates the Jump Break feature in action.
Which method you choose depends on which post editor you are using. If you are not sure which editor your using check this out by going to setting > Basic and Scrolling to the bottom of the page. Under Global Setting you will see a radio Button next to old editor of updated editor.
Click on the Jump Break icon to insert a jump break into a Blogger post. A jagged dividing line will appear to mark the insertion point. A divider line indicates where the jump break will occur.
Publish Your post as Normal.
Insert the following code at the point where you want to break the jump Break to occur:
Publish post as normal.
To save time it is possible to automatically add Jump Breaks to Post with the following method:
Add the code to your Post Template in Setting | Formatting to automate Jump Break:
To Change the Read More Text:
if you want to change the read more text for something like Read Full Story or Continue Reading You can easily do this by:
Directly below this line insert the following code into your Blogger Template:
- Example post showing Blogger new jump breaks read more feature.
- How to Insert Jump Break (Read More Links) In Blogger Blogspot Blog:
- It is easy to insert a jump Break into your Blogger post (Blogspot Posts) at any point of your choosing.
- These are two methods of inserting the Jump Breaks in Blogger.
Which method you choose depends on which post editor you are using. If you are not sure which editor your using check this out by going to setting > Basic and Scrolling to the bottom of the page. Under Global Setting you will see a radio Button next to old editor of updated editor.
Select Blogger Editor From Setting: Basic:
Step 1:
Insert Jump Breaks - New Blogger Post Editor Only:
In order to use this method you need to be using the updated editor in Blogger or have Blogger in Draft enabled. When creating a new post in the Blogger Post Editor position the cursor in the editor at the point you wish the Jump Break to be inserted. Click on the insert Jump Break icon (currently the last option on the menu).
Publish Your post as Normal.
Step 2:
Insert Jump Breaks - Older Blogger Post Editor Only:
If you are using the old post editor rather than the new post editor you can still insert jump break into your Blogger posts. When creating a new post in the Blogger post editor make sure you are in the Edit HTML mode rather than compose mode.
Insert the following code at the point where you want to break the jump Break to occur:
<!-- MORE -->
Publish post as normal.
Tips and Troubleshooting:
To Add Jump Breaks to New Posts Automatically:
To save time it is possible to automatically add Jump Breaks to Post with the following method:
Go to Setting > Formatting and Scroll to bottom of the page:
Under Post Template paste <!-- MORE --> into the box and save. The next time you7 create a new post the <!-- MORE --> will automatically appear. Make sure you are in the Edit HTML mode to See <!-- MORE --> appear.
Add the code to your Post Template in Setting | Formatting to automate Jump Break:
To Change the Read More Text:
if you want to change the read more text for something like Read Full Story or Continue Reading You can easily do this by:
- Go to Design > Page Element
- Edit the Blog Posts Widget
- Chang the post page link text Read More Text which appears at the top of the page to your preferred text and save.
- Jump Breaks Page Link text can be changed via Blogger Layout Page Element Edit Blog Posts:
- To manually add jump breaks to Blogger For Users of Customized Templates. If you are using highly a customized template or have customized your blog posts widget you may experience a problem in getting the blogger jumps break feature to work. In this event you can edit your Blogger Template to enable jumps Breaks.
- As a precaution back up your template by downloading full template to your own computer.
- Tick the Expand Widget Template Check Box:
- Using CTRL + F find the following line of code:
<data:post.body/>
Directly below this line insert the following code into your Blogger Template:
<b:if cond = 'data:post.hasJumpLink'>
<div class = 'jump-link'>
<a expr:href='data:post.url +"#more"'><data:post.jumpText/></a>
</div>
</b:if>
Post a Comment
Thanks For Comment This Blog Post. Like It And Subscribe It.