By default on blogger you have the option to add a jump break to your blog post, Using this option blogger displayed only a part of your posts on index pages and the link to read the full post will be below. This is a conventional read more option provided by blogger in post editor. In this conventional read more hack, every time you need to insert code in post.
In today's post we will share auto read more hack with thumbnail for blogger blog, This script will automatically create post summaries with thumbnail. You don't need to add any extra code in every blogger post and if you insert image, it appears thumbnail.
Applying Auto Read More
- Go to Design > edit HTML
- Backup your template
- Tick on "Expand Widget Templates"
- In the code window Find this code..
<data:post.body/>
- Replace with this code below,
<b:if cond='data:blog.pageType == "static_page"'>
<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...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>
<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...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>
- Now, search for </head> 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>
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>
Customizing the code above :
You can customize the 'Read more' option by changing the value of the variables below:
- If you want to change image thumbnail size then find these numbers 100 and 120
- To change post cut height without image find these line of code - summary_noimg = 430;
- To change post cut height with image find these line of code - summary_img = 340;
Did you try this widget ? I think it's not working any more.
ReplyDeleteHello Spurs i tested it many times and it works properly :)
DeleteI like your current blog templete,would you like to give me a copy of your blog templete?.Please let me also use in my blog.I hope you will help me.
ReplyDeleteWhy Not....please provide me your email address.
Deletei also want your template design..can you also give it to me...as your every post is showed in thumbnails with hover effect of comment ets....this is my email shoaibshuja95@gmail.com
DeleteThis comment has been removed by a blog administrator.
ReplyDeleteThanks for dropping by madhav...i appreciate your work.
ReplyDeletehi dear i tried this widget..but it is not working..this is my blog.i have made the changes in html but still no change
ReplyDeletehttp://allofmyanswers.blogspot.com/
i adore your style. but i have a trouble with this at http://expertbloggertricks.blogspot.in/
ReplyDeleteit shows only 5 posts.plz fix it soon
nice http://clubsideeffects.blogspot.com/
ReplyDeleteI need to change layout of the summary. can you help ?
ReplyDeleteI like your current blog templete,would you like to give me a copy of your blog templete?
ReplyDeletePlease let me also use in my blog.I hope you will help me.
This is my email - vpypbh@gmail.com
Bloggers must not be viewed simply as an extension of the traditional media while it may seem like a fairly easy exercise, there are a few important rules that will be followed as a way to talk to them efficiently. Read More Button for Blogger
ReplyDeleteHello i like ur current template,pls can you gve me a copy?
ReplyDeleteThank inadvance
This comment has been removed by the author.
ReplyDeleteIt's not working, can you tell me the reason, I follow as you written..
ReplyDeleteIt didnt work for me pls. You can check my blog at W3HowTo
ReplyDeleteMidbrain Activation
ReplyDeleteMidbrain Activation
Midbrain Activation
Midbrain Activation
Midbrain Activation
Midbrain Activation
Midbrain Activation
Thanks so much for writing this article.This is probably the best one by far. Easy to understand and educate myself on Blogger. Thanks a lot really appreciate you sharing this with us.
ReplyDeletewebsite traffic generator
This article is extremely useful and intersting,Thanks for sharing such an instructive article with us.
ReplyDeletekeep updating.....
web development company in gurgaon
Automobile title advances are a snappy and basic answer for a few circumstances when you require money rapidly and particularly on the off chance that you have credit issues which leaves couple of other getting choices accessible for you. aaa1autotitleloans.com/chicago
ReplyDeleteAn commodity to accent the accent of backups. Backups are actual abundant all-important abnormally in the advice age. Bill Gates already said that the backbone of your alignment depends on the breeze of information. If that advice is lost, the alignment loses its strength.
ReplyDeletewebsitebackupbot
You can latest information regarding and download pdf official available RPF Constable Admit Card and get exam details
ReplyDeleteITS REALLY A GOOD THING TO DEAL WITH YOUR ISSUES YOURSELF,
DeleteARE YOU SEEKING A WAY TO RETRIEVING ALL LOST FUNDS THROUGH BTC BINARY OPTIONS???
But Here is the good news !!!
You don’t have to RISK❌ Finding a hacker yourself;
“that’s the number one step to being or getting scammed” (AGAIN)🚫❌
To ensure that who you in contact with is a real hacker
We are here to link you up if you ever need a legit hacker to deal with you cyber mishaps without any risk involved.
Cyber shield hacking agency can link you to many legit hackers that you won’t believe you could ever come across to getting your jobs done,
Eg:
◾ALBERT GONZALEZ ⭐️⭐️⭐️
(an overall 3 star hacker that specializes in credit card mishap and BINARY RETRIEVAL).
◾COSTELLO FRANK⭐️⭐️⭐️⭐️⭐️
(overall 5 star hacker that deals with criminal and blog cleaning).
◾FRANS ROSEN$ ⭐️⭐️⭐️⭐️
(overall 4 star hacker, MAINLY FOCUSED AT RETRIEVING ALL YOUR MONEY LOST THROUGH BINARY OPTIONS)
◾JEANSON JAMES ANCHETA ⭐️⭐️⭐️⭐️
(4 star specialist in social site And BLANK ATM CARDS).
Websites🌎 and means of contact🖥 will be sent to you according to the mishap you need help about.
◾OUR "AIMS" HERE◾
Are:
1◾to assign a qualified✔️✔️ agent⭐️ of specific rank to particularly any sort of cyber issues you intend dealing with in short and accurate timing.
2◾ to screen in real hackers⭐️ (gurus only) in need of job with or without a degree, to speed ⚡️up the availability of time given to for Job contracts.!!
Thus an online binary decoding exam will be set for those who seeks employment under the teams Establishment.
write 📝📝 us on:
◾Protocolhacks@gmail.com
◾Cybershieldnotch@gmail.com
Or drop your message to us on WICKR (Btcbinaryhacks)
ADMIN signed
⭐️Thank y’all.....!
ITS REALLY A GOOD THING TO DEAL WITH YOUR ISSUES YOURSELF,
ReplyDeleteARE YOU SEEKING A WAY TO RETRIEVING ALL LOST FUNDS THROUGH BTC BINARY OPTIONS???
But Here is the good news !!!
You don’t have to RISK❌ Finding a hacker yourself;
“that’s the number one step to being or getting scammed” (AGAIN)🚫❌
To ensure that who you in contact with is a real hacker
We are here to link you up if you ever need a legit hacker to deal with you cyber mishaps without any risk involved.
Cyber shield hacking agency can link you to many legit hackers that you won’t believe you could ever come across to getting your jobs done,
Eg:
◾ALBERT GONZALEZ ⭐️⭐️⭐️
(an overall 3 star hacker that specializes in credit card mishap and BINARY RETRIEVAL).
◾COSTELLO FRANK⭐️⭐️⭐️⭐️⭐️
(overall 5 star hacker that deals with criminal and blog cleaning).
◾FRANS ROSEN$ ⭐️⭐️⭐️⭐️
(overall 4 star hacker, MAINLY FOCUSED AT RETRIEVING ALL YOUR MONEY LOST THROUGH BINARY OPTIONS)
◾JEANSON JAMES ANCHETA ⭐️⭐️⭐️⭐️
(4 star specialist in social site And BLANK ATM CARDS).
Websites🌎 and means of contact🖥 will be sent to you according to the mishap you need help about.
◾OUR "AIMS" HERE◾
Are:
1◾to assign a qualified✔️✔️ agent⭐️ of specific rank to particularly any sort of cyber issues you intend dealing with in short and accurate timing.
2◾ to screen in real hackers⭐️ (gurus only) in need of job with or without a degree, to speed ⚡️up the availability of time given to for Job contracts.!!
Thus an online binary decoding exam will be set for those who seeks employment under the teams Establishment.
write 📝📝 us on:
◾Protocolhacks@gmail.com
◾Cybershieldnotch@gmail.com
Or drop your message to us on WICKR (Btcbinaryhacks)
ADMIN signed
⭐️Thank y’all.....!
Very informative blog.
ReplyDeletehttp://www.digitalpacemaker.in/DigitalMarketing
It truly depends. On the off chance that your business is normally extremely dissolvable and you're simply having a slight income issue incidentally or your business is developing and you require additional money currently, check cashing san diego
ReplyDeletehappy new year quotes 2019 in english new quotes in english
ReplyDeletehappy new year quotes 2019 in hindi best one
ReplyDeleteFinding shabby show tickets on the web, then again, is an alternate story.Obtaining modest show tickets has turned out to be simple these days, because of the multiplication of online destinations that represent considerable authority in offering marked down tickets for a wide range of shows. nfl tickets no fees
ReplyDeleteWishing every one here in advance the most happy new year eve 2019 happynewyearwishes2019.info
ReplyDeleteIn a class activity suite recorded by a legitimate informing organization which makes its living with answers for both the Short and Long Codes, documented 4/5/2012 against the Short Codes overseeing body organizations. vivd seats discount code
ReplyDeleteYou can latest information regarding and download pdf official available HSSC Group D Answer Key 2018 & get other imp details.
ReplyDeleteI want to to thank you for this wonderful read!! I definitely loved every bit of it. I have got you bookmarked to check out new things you post… Buon Anno 2019
ReplyDelete
ReplyDeletesnaptube downloading
snaptube apk
snaptube app
snaptube download
With that said, iOS users can install Snaptube on their devices and download any type of music they want without having to pay a single time.
valentine day messages for mom new ideas for mother
ReplyDeletevalentine day puppies best images for her
ReplyDeletevalentine day imagese best images
ReplyDeleteBaterai Tanam
ReplyDeleteService Electronic
Handphone Error
ZTE Huawei
LCD Warna Warni
Freelance
Xiaomi
Port USB
Cara Root
ReplyDeleteCamera
Android Error
iPhone
Kursus Terbaik
Penyebab HP Mati
iCloud
Ringtone
Service LCD LED
mobdro
ReplyDeletemobdro apk
mobdro app
mobdro download
mobdro for android
Another popular Android best TV application for watching live sports is Mobdro.
happy new year 2019 video
ReplyDeleteRexoxer
ReplyDeleteRexoxer
ReplyDeletesnapseed for windows pc
Well, if you want to use this full-fledged photo-editor on a Windows PC then give Snapseed For PC a try.
Thank you sir, I like your thoughts and your ideas this article, by the way we have one of the best hard disk cleaner called windirstat which will clean your all un needed filed from your PC.
ReplyDelete