Just like the Peek-a-boo exclusion trick we will use the getElementsByClassName function to fetch the full contents of the first post and make it visible. But before you proceed further you need to have the Expandable Post Summaries Hack already implemented on your blog.
Once you have done that:
- Copy and paste the getElementsByClassName JavaScript function between the <head></head> tags.
- Then search for the posts loop. It should look somewhat like this:
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
</b:loop>
Now add the following lines of JavaScript code immediately after that.<script type='text/Javascript'>
<!--
getElementsByClassName("fullpost")[0].className = "";
getElementsByClassName("contreadlink")[0].style.display = "none";
-->
</script> - Finally add a class to the Continue Reading link so that we can hide the link for the first post.
Search for this tag:<b:if cond='data:post.url'> » <a expr:href='data:post.url' title='Permanent Link'>Continue reading</a></b:if>
and replace it with<b:if cond='data:post.url'><span class="contreadlink"> » <a expr:href='data:post.url' title='Permanent Link'>Continue reading</a></span></b:if>
Thats it, you're done!
If you have a better way to achieve the end result, do let us know.
» Continue reading
Read more on Blogger, Blogger Hacks, Blogging
Newer Posts
