Automatic Read More Hack For Blogger With Thumbnail

Automatic Read More Hack For Blogger With Thumbnails i.e expandable post hack for blogger with thumbnail of image used in blogger posts and all this work is done by the script automatically,you just dont need to locate your image the script will do all work for you automatically.Just you have to write your post and publish it with one image in post related to post.

If you dont want to add thumbnail image in post summary then i had an post previously on automatic read more hack for blogger,read this.

Now how to install Automatic Read More Hack For Blogger With Thumbnails Demo snapshot is below.

Lets start with its installation:-

Now Login to Blogger Go to Layout > Edit HTML in your Blogger dashboard and check the “expand widget templates” box.

Find the closing </head> tag in your blog template, and paste the following section of code immediately before it:

<script type=’text/javascript’>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
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 = 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 in above codes we can change the numeric numbers according to our need

summary_noimg = 430; is post cut height without image
summary_img = 340; is post cut height with image
img_thumb_height = 100; is thumbnail image height
img_thumb_width = 120; is thumbnail image width

Now find this code <data:post.body/> in your template and replace it with below codes.

<b:if cond=’data:blog.pageType == &quot;static_page&quot;’><br/>
<data:post.body/>
<b:else/>

<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> <span class=’rmlink’ style=’float:right;padding-top:20px;’><a expr:href=’data:post.url’> read more “<data:post.title/>”</a></span>

</b:if>
<b:if cond=’data:blog.pageType == “item”‘><data:post.body/></b:if>
</b:if>

Preview Your template if its showing thumbnail with read more hack Save it.

To show thumbnail it should have one image in your blogger posts and please upload the .js file to your server and dont forget to change the link with yours in codes to make this hack work.

I am sure everybody will love this hack for sure.babai

Credits:-vietwebguide

153 Comments

  1. Anshul May 1, 2009
  2. Afzal May 4, 2009
  3. imran May 8, 2009
  4. Toel May 9, 2009
  5. Anshul May 15, 2009
  6. mie May 18, 2009
  7. Anshul May 18, 2009
  8. Anshul May 24, 2009
  9. kurt gaston June 10, 2009
  10. Anshul June 10, 2009
  11. free gambling online June 23, 2009
  12. Anshul June 23, 2009
  13. Sandeep June 28, 2009
  14. Anshul June 28, 2009
  15. Sandeep June 28, 2009
  16. Anshul June 28, 2009
  17. Sandeep June 30, 2009
  18. Bloggers July 6, 2009
  19. ayomaos July 9, 2009
  20. Hakimei July 25, 2009
  21. Ananth Kumar August 16, 2009
  22. Vera September 2, 2009
  23. d'goin over September 2, 2009
  24. Jared September 6, 2009
  25. Anshul September 6, 2009
  26. Jared September 6, 2009
  27. Anshul September 7, 2009
  28. Zona Blogger September 11, 2009
  29. galo September 17, 2009
  30. Anshul September 18, 2009
  31. myrezqi September 24, 2009
  32. Hackpacker September 26, 2009
  33. Rafael September 30, 2009
  34. !i! KSAK !i! October 8, 2009
  35. Chris October 22, 2009
  36. Lee October 22, 2009
  37. Chris October 22, 2009
  38. Anshul October 23, 2009
  39. Chris October 23, 2009
  40. Anshul October 23, 2009
  41. Chris October 23, 2009
  42. Anshul October 23, 2009
  43. Николай October 26, 2009
  44. Central Fitness November 6, 2009
  45. Husho November 7, 2009
  46. zee has November 12, 2009
  47. marketing manager November 19, 2009
  48. marketing manager November 19, 2009
  49. Noriko & Aaron Evans November 27, 2009
  50. Anshul November 27, 2009
  51. Noriko & Aaron Evans November 27, 2009
  52. Nathawud November 29, 2009
  53. Anshul November 30, 2009
  54. W.I.N. CP November 30, 2009
  55. Anshul December 1, 2009
  56. aku lucu sekali December 3, 2009
  57. SVR Top Blog Admin December 7, 2009
  58. Stagger Lee December 8, 2009
  59. Anshul December 8, 2009
  60. Stagger Lee December 9, 2009
  61. mike December 16, 2009
  62. Anshul December 16, 2009
  63. mike December 17, 2009
  64. Anshul December 17, 2009
  65. Jani December 20, 2009
  66. PekanbaruRiau.Com December 21, 2009
  67. AndreasColor December 22, 2009
  68. AndreasColor December 22, 2009
  69. Catherine December 22, 2009
  70. Anshul December 22, 2009
  71. Lifestyle on The Net December 23, 2009
  72. Admimis December 25, 2009
  73. perer December 26, 2009
  74. vijay January 7, 2010
  75. Lift Off January 9, 2010
  76. Yuvanesh January 10, 2010
  77. Iranildes Costa January 24, 2010
  78. Roger February 22, 2010
  79. decogzz March 1, 2010
  80. Anshul March 2, 2010
  81. Boris Velikanje March 16, 2010
  82. Anshul March 16, 2010
  83. Prabha March 17, 2010
  84. DomiDarko March 24, 2010
  85. optimist March 24, 2010
  86. Rayk Cool April 1, 2010
  87. Dr. Archana Verma April 14, 2010
  88. Dr. Archana Verma April 15, 2010
  89. Anshul April 15, 2010
  90. d0od April 21, 2010
  91. Juan J. Espinoza April 28, 2010
  92. Anshul April 28, 2010
  93. Juan J. Espinoza April 30, 2010
  94. Anshul April 30, 2010
  95. takycardia May 8, 2010
  96. princess_vie May 12, 2010
  97. bagoesky May 17, 2010
  98. Anshul May 17, 2010
  99. Barunang May 19, 2010
  100. raso May 21, 2010
  101. JDM_Car May 24, 2010
  102. Anshul May 24, 2010
  103. LISE June 1, 2010
  104. Anshul June 1, 2010
  105. bloguetest June 2, 2010
  106. Anshul June 4, 2010
  107. Kartal June 10, 2010
  108. Anshul June 11, 2010
  109. Klustter June 11, 2010
  110. Carmen Araneta June 13, 2010
  111. Anshul June 13, 2010
  112. Carmen Araneta June 14, 2010
  113. Carmen Araneta June 14, 2010
  114. veryn June 16, 2010
  115. veryn June 17, 2010
  116. Jaky Astik June 18, 2010
  117. balispot June 26, 2010
  118. Carlos Javier July 2, 2010
  119. Carlos Javier July 2, 2010
  120. Pink Mooki July 16, 2010
  121. Admin July 18, 2010
  122. Administrator July 18, 2010
  123. Anshul July 22, 2010
  124. Anshul July 26, 2010
  125. Anshul July 26, 2010
  126. Anshul July 27, 2010
  127. Maey August 2, 2010
  128. Asad Jamal August 11, 2010
  129. Asad Jamal August 11, 2010
  130. :) Admin (: August 17, 2010
  131. Anshul August 18, 2010
  132. chethan ks August 20, 2010
  133. powerfuldeep August 26, 2010
  134. Amy (the b-line) September 24, 2010
  135. Anshul September 25, 2010
  136. Amy (the b-line) September 25, 2010
  137. Muhammad Behzad Akhtar October 29, 2010
  138. hanvico November 5, 2010
  139. Jeet Dholakia November 12, 2010
  140. galleryswarm June 17, 2011

Leave a Reply