I had tried to find out how to add "read more" on my blogger and followed someone's guide as below - which I noticed there is the limitation.
DO NOT FOLLOW THIS WAY.
THE CORRECT VERSION IS IN THE BOTTOM OF THIS POST.
1. Add the below right before <head>
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
</head>
2. Add the below code after <data:post.body/>
<div class='post-body'>
<p><data:post.body/>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>(Read more inside ..)</a>
</b:if></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
3. Settings | Formatting | Post Template
Add the below and save.
<span class="fullpost"">If you apply the above code, the below are the results.
</span>
1. Looks Work
2. Not really
1) Firefox does not work
2) If you have a short post and don't add the below code in the post, the browser still shows "Read more".
<span class="fullpost"">
</span>
FOLLOW THIS WAY. IT RESOLVES THE ABOVE.
1. Make sure you have the back up of the current template XML.
2. Add the below right before </head>
<b:if cond='data:blog.pageType != "item"'>
<script type='text/javascript'>
var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
</script>
</b:if>
</head>
3. Add the below code after <div class='post-body'
<div class='post-body' expr:id='"post-" + data:post.id' >
<b:if cond='data:blog.pageType == "item"'>
<style>#fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost{display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<a expr:href='data:post.url'>Read More......</a>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
4. Settings | Formatting | Post Template
Add the below and save.
<span id="fullpost"">
</span>
Now if you apply this correct version, you will see the below results which are all good.
1. Firefox
2. Short Posts that does not have the below code.
<span class="fullpost"">
</span>
If you use the second version above, you will be cool!
er, sorry dear.. but I couldn't save all the edited html above. I am using the new blogger.
The code in your guide couldn't be parsed correctly. huhu
Hi Ladyheart, Plz try the second step of the correct version above. This is the matter of how the post shows & to &, < to <, and so one which caused your XML could not be parsed. Anyway, I corrected the post and reposted for the source part above.
Thanks for letting me know. :)
Shuold I add this code before head or /head?
Plz inform.
I got it! Thanks. :)
Great! The code should be right before </head>.
2. Add the below right before "head"
-----
I think it would be nice if u correct the typo. :)
Oops~ I did not aware... Anyway I corrected the typo from <head> to </head>. Thanks for letting me know.
Need a lil help here!!...m not able to find 'div class='post-body'' tag in my blogger template.....plz help maai
hackcastle, It's not possible the tag is not existed. I see your blogger that I can find out the tag <div class='post-body'>.
Please try to find out again.
Look for post-body. Somethimes quation marks are converted to some kinda code. So u may not find the exact whole line.
Also, look for !-- (Main) -- or div class='contentwrapper'. Post-body should be below it.
Can I translate this tutorial with proper acknowledgements?
You can post this tutorial in another language with the name of my blogger and the URL (source). Good Luck!
Thanks a lot. :)
Thanks for your method. However, there are some inconveniences for this method. What are these inconveniences? Please visit my blog http://easyadsensevn.blogspot.com/2008/09/how-to-add-blogger-read-more-expandable_02.html for more details. Thanks again for your useful post!
Thank you, EasyAdsenseVn!
Ssannara, can u tell me how to post "? because when i write down the " it will turn into ("). How to make it stay remain? plz help me. thanks
Hi Herman, I am not quite sure what you exactly asking. If you are asking to enter the double quotation when you post the article, you need to type " and it interprets and shows ". Please let me know if you are asking something else.
Does your script change the display of long postings for blogs that exist prior to making the changes?
hello i loooooooove you!
thx i tried at least five versions to make this, and everyone failed!
super, thanx a lot!
PS. One mistake:
id="fullpost""
there are two ("), but there has to be only one!
thanx again, your're great
hi,
thanks a lots for your code. It's exactly what I want. It really working to solve the short post problem.
but I found that my long post is shown full in firefox.
Can you help to check my code?
I can't figure out why it's doesn't work for firefox. (it's work well in IE).
my blog is www.investment-klse.blogspot.com, it's in chinese language, hope you don't mine.
Hello, i do copy and paste the code right the code that gaiven. But all my post was dissapear. How to solve this. May you can help me to solve out this prob. Thanks
SSannara, great post! I implemented this on a long blog post of mine and it works very well. However... the blog post is not crawled by Google search!? Did you experience this?
I cannot find http://globetrottingonline.blogspot.com/2009/04/why-i-use-firefox.html in Google search at all.
However, if you go to my blog homepage, the posts that were submitted after the one mentioned above, do appear in Google. Maybe google's crawler does not link this solution where the text is hidden by using your solution...?
I maked translate for blogger in my blog..Read more (devamını oku)
Hi - Just wanted to say thanks for this tip. I'd used a number of other read more hacks, but they always displayed read more on short posts. Now I can select the posts I want. Anyone interested, you can see this working at www.testertroubles.com
It doesn't look like you are paying attention to posts anymore; BUT, I was looking for "read more" code to add - came across this posting - wanted to add it - BUT, don't dare now because at least two VERY DISTURBING comments have been unanswered!
1- Posts using this code are not indexed by GOOGLE?!!
2- It doesn't work in Firefox?!!
a- does it foul up Google spiders?
b- does it or doesn't it work in firefox?
thanks
DJ
http://offroadinghome.blogspot.com/