How To Add Together Automatic 'Read More' On Blogger/Blogspot


fix a broken static page past times removing automatic 'read more' features on blogger. And today I will percentage to you lot the contrary of my previous post, how to do postal service summaries on your blogger posts.

Some blogger templates does non accept an automatic postal service summary characteristic together with thence you lot accept to insert 'jump break' on each of your articles. This fox is practiced if you lot don't want the hassle of putting saltation interruption i past times one.

So lets commencement shall we

How to add together automatic 'read more' on blogspot


1. Go to your blogger template > edit HTML > click expand widget

2. Search for the </head> using CTRL+F.

3. Add the code below but earlier the </head> tag.

<script type='text/javascript'> summary_noimg = 250; summary_img = 200; img_thumb_height = 150; img_thumb_width = 150;  </script> <script type='text/javascript'> //<![CDATA[  utilization removeHtmlTag(strx,chop){   if(strx.indexOf("<")!=-1)  {   var second = strx.split("<");    for(var i=0;i<s.length;i++){     if(s[i].indexOf(">")!=-1){      s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);     }    }    strx =  s.join("");   }  chop = (chop < strx.length-1) ? chop : strx.length-2;   while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;   strx = strx.substring(0,chop-1);   furnish strx+'...';  }  utilization createSummaryAndThumb(pID){  var div = document.getElementById(pID);  var imgtag = "";  var img = div.getElementsByTagName("img");  var summ = summary_noimg;  if(img.length>=1) {    imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';   summ = summary_img;  }   var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';  div.innerHTML = summary; }  //]]> </script>

Note: You tin alter the values every bit you lot like.

summary_noimg : divulge of graphic symbol to display when at that spot is no image.
summary_img : divulge of graphic symbol to display when at that spot is an image.
img_thumb_height : hight of the postal service thumbnails.
img_thumb_width : width of the postal service thumbnails.



4. Look for this tag <data:post.body/>.

5. And supervene upon it with the next codes below.

<b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:blog.pageType != "item"'> <div expr:id='"summary" + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script> </b:if> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>  <b:if cond='data:blog.pageType == "static_page"'><data:post.body/></b:if>  <b:if cond='data:blog.pageType != "static_page"'> <b:if cond='data:blog.pageType != "item"'> <div style='float:right;margin-right:10px;margin-top:5px;'> <a expr:href='data:post.url'>Read More</a> </div> </b:if> </b:if>

Save template!


Did this fox help? Kindly spread the honey past times sharing us on your favorite social networking site.