Make Long Post Short on Blogger Homepage With Read More Option

On blogger there is a option to add a jump break to your posts, so the post will show with a short summary on homepage and also a link with a full post. The jump break have some great advantages, if you displays you full post on your blog homepage it will slow down your blog load time but with a jump break visitors that land on your blog homepage will see the selection of your posts without need to scroll. It's also more professional and visitors have to click to the full post and will helps ti increases the pages views.

Yesterday i received a request from one of my blog reader requested for make a long post short on blogger homepage.

"Hello bro there is a problem on my blog homepage, my blog post is very long how i make it like yours where by post will only show not all the whole details will just show, is there any way to make it short"

The above statement was sent to me to my Facebook account by one of regular reader of this blog. Today i will show to you how to summarize a blog content and how to show summary content with "read more" option on blog homepage, blog archives, blog labels page using automatic "read more" simple script in your blog template. Using read more on your blog will make your blog loading faster by showing with a few post instead of the full post on blog homepage and it will make your more good and professional.
Automatic read more for blogger users can be done by adding some code into blog template. Below are the simple tutorial on how to install Automatic Read More For Blogger with thumbnails and how it will look after installation.

Summarize Your Blog Content With Read More Option

Step-1

• Login to your blogger dashboard.
• Goto template.
• Click on Edit Html.

Step-2

Find the below code by pressing Ctrl+F

</head>

• Copy the following code and paste it Above/Before </head>

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript' src='http://widgets.way2blogging.org/blogger-widgets/w2b-auto-readmore-blogger.js' ></script>

Step-3

• Now again find the below code in the template by pressing Ctrl+F

<data:post.body/>

Step-4

• Replace the following below code with <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if>
</b:if>

Step-5

• Save your template.

That's it all of your posts including on home page, archived page, labels page will now be displayed with summary and read more option.

Add your comments, views and opinions below.