Monday, October 23rd, 2006
so now, i will show you how to hack the “How can I make show/hide links for my posts?” hack by blogger..
this is a bit trickier since on every post you make, you have to make sure that you give a unique id..
First of all, add these codes within your area and right after the closing of your style sheet..
<style>
.posthidden {display:none}
.postshown {display:inline}
</style>
<script type=”text/Javascript”>
function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className==”postshown”) {
whichpost.className=”posthidden”;
}
else {
whichpost.className=”postshown”;
}
}
</script>
Now for each post that you plan on adding the show/hide link to, you have to add this span tags as well as a link tag for the show/hide posts..
<span class=”posthidden” id=”WHATEVER YOU WANT TO CALL THIS POST AND MUST BE UNIQUE”></span>
<a href=”javascript:expandcollapse(’WHATEVER YOU WANT TO CALL THIS POST AND MUST BE UNIQUE’)”>
[+/-] show/hide this post</a>
so lets say that:
Here is the beginning of my post.<span class=”posthidden” id=”example post”>And
here is the rest of it. </span>
<a href=”javascript:expandcollapse(’example post’)”>
[+/-] show/hide this post</a>
for an example, follow this link here
Posted in techie | 1 Comment »
Friday, October 20th, 2006
Have you ever wondered how to use the expandable post summaries hack without having “Read more” message appear on every single post? Personally, I find it irritating to have a read more link on a post that doesn’t even need it…
Anyways, I will show you how to hack the expandable post summaries hack using javascript..
First of all, add these codes within your <head> </head> area and right after the closing of your style sheet..
<style>
<MainOrArchivePage>
span.fullpost {display:none;}
</MainOrArchivePage>
<ItemPage>
span.fullpost {display:inline;}
</ItemPage>
</style>
<script type=”text/javascript”>
var memory = 0;
var number = 0;
</script>
Next, you have to add the following code to your template, somewhere after the <$BlogItemBody$> tag:
<MainOrArchivePage>
<script type=”text/javascript”>
spans = document.getElementsByTagName(’span’);
number = 0;
for(i=0; i < spans.length; i++){
var c = ” ” + spans[i].className + ” “;
if (c.indexOf(”fullpost”) != -1) {
number++;
}
}
if(number != memory){
document.write(’<a href=”<$BlogItemPermalinkUrl$>”>Read more…</a><br>’);
}
memory = number;
</script>
</MainOrArchivePage>
For each post that you want to use this feature on, you will need to place this code:
<span class=”fullpost”> </span>
So let’s say that:
Here is the beginning of my post. <span class=”fullpost”>And here is the rest of it. </span>
And that’s it! If you’re wondering if this really works, it does because I just used it on this post.. Hope you enjoy it… and stay tuned I will also show you how to hack the show/hide posts hack.. Until then…
Posted in ramblings | 4 Comments »