How to add Auto Read More in Blogger?

How to add Auto Read More in Blogger?

The steps involve in adding a automatic jump break to your Blog post is simple if you follow the instruction carefully, jump break makes your blog look neater and make ease for reader to read summery of your post, the posts will be displayed with just a short summery on the home page and a link to read the full post will be below. the advantages of break jump was that, it will reduce the content on your blog and speed up your browser to load your blog much faster, Also applying jump break to your blog, allow visitors to click on your summary before having access to the full post, it increases page views.


  • Your posts will automatically be displayed as short summary’s with a read more link.
  • An image from the post will be re sized into a thumbnail and displayed beside the summery.
  • You can choose how much text is displayed in the summery.
  • The Read more will also apply to all your previous post
  • Your thumbnail size can also be adjust to your preferred size.

How to add Auto Read More in Blogger?

To get this apply to your site, follow the few steps below;

#1: Login to your blogger dashboard

#2: Click on Template

#3: Remember to Back up your template (not compulsory)

#4: Click on Edit HTML

#5: Press CTRL + F on your keyboard, the find </head>

#6: Copy and paste the code below, 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 type="text/javascript">
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('j m(a,b){6(a.5("<")!=-1){3 s=a.J("<");I(3 i=0;i<s.4;i++){6(s[i].5(">")!=-1){s[i]=s[i].7(s[i].5(">")+1,s[i].4)}}a=s.E("")}b=(b<a.4-1)?b:a.4-2;z(a.u(b-1)!=\' \'&&a.5(\' \',b)!=-1)b++;a=a.7(0,b-1);r a+\'...\'}j q(a){3 b=A.o(a);3 c="";3 d=b.p("k");3 e=t;6(d.4>=1){c=\'<h v="w:x; y:g K B g;"><k 9="\'+d[0].9+\'" C="\'+D+\'8" F="\'+G+\'8"/></h>\';e=H}3 f=c+\'<l>\'+m(b.n,e)+\'</l>\';b.n=f}',47,47,'|||var|length|indexOf|if|substring|px|src|||||||0px|span||function|img|div|removeHtmlTag|innerHTML|getElementById|getElementsByTagName|createSummaryAndThumb|return||summary_noimg|charAt|style|float|left|padding|while|document|5px|width|img_thumb_width|join|height|img_thumb_height|summary_img|for|split|10px'.split('|'),0,{}))

#7: Find this next code again <data:post.body/>

#8: Replace it with below codes

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; +'>
<script type='text/javascript'>
<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>

#9: Now click Save Template.

Then you are done, if your post contain an image, it will be automatically use as your thumbnail.

Few words from Author

Thank you for patronizing Ultimate PC Tech. This post is about, "How to add Auto Read More in Blogger?". I am sure your visit to us must be quite satisfying and in line with your expectations from us. Just in case, it’s not as you expected from us or if you are facing any problem, kindly forward your feedback’s directly to us by leaving a Comment below. And, get assured response from my side. Your feedback’s and suggestions are extremely valuable to us. This Post is written by the team of Ultimate PC Tech. There is no any source if any then already mentioned so Copying or using this post’s content for your own site is not allowed. If anyone do so, get ready for facing DMCA. Please, if you like this post then share on your social networking sites. Assuring you of our best service always. Protection Status

Next Post »