Customizing Blog Post in Home Page - Read More Link Including Thumbnail

If full content of the blog post is shown in home page, it looks little clumsy site because it looks in little bad format. So that making every post in the blog home page to be displayed with “read more” is more useful to avoid this kind of imperfectness.

To be a lot of specific, this may show the title of the post, then a brief outline with variety of characters and a fingernail, which will be the fingernail of the primary image uploaded within the post. Once the fingernail and therefore the post outline, there'll be a "Read More" link, that after you click on that, can take you to the particular post.
Creating Posts Within The Blog Homepage to be Displayed With Associate "read more" Button & a Fingernail.

This Automatic browse a lot of script can summarize content and the posts outline are going to be shown solely on the most blog page, class pages, and archive pages.

  • Log in to your blogger dashboard
  • Go to Template then click on EDIT HTML
  • Then press CTRL+F keys and search the following code

<data:post.body/>

  • You can find this code 3 times 
  • Replace the above code by using the given 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; + data:post.id'><data:post.body/></div>  <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><span class='readmore' style='float:right'><a expr:href='data:post.url'>Read More &#187;</a></span></b:if></b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if><b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

  • Now search the </head> tag
  • And then paste the given code above the </head> tag

<script type='text/javascript'>posts_no_thumb_sum = 490;posts_thumb_sum = 400;img_thumb_height = 120;img_thumb_width = 120;</script><script type='text/javascript'>//<![CDATA[function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1){var s = 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);return strx+'...';}function createSummaryAndThumb(pID){var div = document.getElementById(pID);var imgtag = "";var img = div.getElementsByTagName("img");var summ = posts_no_thumb_sum;if(img.length>=1) {imgtag = '<span class="posts-thumb" style="float:left; margin-right: 5px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';summ = posts_thumb_sum;}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';div.innerHTML = summary;}//]]></script>


Comments