Another Summary Expandable Post

Peek-A-Boo Post?

No! No! I shall not called this post or referred to it as a peek-a-boo type of post. I've a great laugh when someone keep on insisting that what I was doing is called a peek-a-boo post!

Let me tell you, all that I know is that some Bloggers who wrote a long post might want to make it short, a summary before the readers will be taken to the full post. The summary might consisted of the first two paragraph of he main post. Usually at the end of the summary, there will be a link that say, "Wanna Read More?" or just "Read More". When the reader clicked on the link, they will be presented with the full post!

Let say, I wanna call this particular type of post, "Baa-Chak!" And I got several hundreds die-hard fans who will keep on insisting calling this type of post, "Baa-Chak!", what do you think might happened? Yeah, that's right. Nobody gonna know what's a peek-a-boo post?

But since everybody keep on insisting referring to this type of post as a peek-a-boo post, then peek-a-boo it gonna be! FYI, there's NO such thing as a peek-a-boo post. It was a name made popular by a certain blogger and their die-hard loyal readers.According to Wikipedia, Peekaboo (also spelled Peek-a-boo, also called Peep-eye in the Southeast US) is a game similar to hide and seek, but played with babies. In the game, one (child, teenager, or adult) hides their face, pops back into the baby's view, and says — to the baby's amusement — Peekaboo! I see you!Anyway, last week I received an email from MRazlieJR, the BlogMaster of All About Music asking for some help with "Baa-Chak!" post. Oops! Sorry! What I meant, he was asking for help after reading my Summary Expandable Post and received an error whenever he tried to implement the codes.

Okay, MRazlieJR. Try out this one for your Summary and Expandable post. A word of caution, as usual before you tweak your template, please back up your template. This is as precaution if anything goes wrong, you can easily upload back to your earlier template.

This is also important. After login to your Dashboard, click on to SETTINGS, then ARCHIVING and set on to YES to ENABLE POST PAGES. This is done to enable post summary for your post to expand!

When everything is all set, go back to your Edit HTML and Expand Widget Templates. Look for this string of codes:

<div class='post-body'>

Right after the above string of codes, paste on the following string of codes:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

Immediately after the string of codes above will be this string of codes:

<p><data:post.body/></p>

And paste this string of codes right after the above string of codes:

<a expr:href='data:post.url'>Click Here to Read More..</a>
</b:if>

After you've done that, pasting up all the said string of codes stated above, your HTML will look like as followed whereby the blue string of codes are the existing codes and the red ones are the one you just pasted:

<div class='post-body'>

<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>

<a expr:href='data:post.url'>Click Here to Read More...</a>
</b:if>

<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

FYI, the underline "Click Here to Read More..." can be changed according to your heart content. After you get everything done as above, save your template.

Wooo! Hold on to your horses, my friend. You're not finish yet. This is what you have to do when you're typing up a new post so that it will appear as intended. You have to add this codes at the end of your summary. Preferably after two short paragraph or wherever you see fit:

<span class="fullpost">

After that, continue typing up until the end of your post. And please end your post with this tag:

</span>

To make it easier for you so that you don't have to type up the tags every times you're creating a new post by doing as follows. Go to Settings then Formatting and at the bottom of the page there is an empty box called "Post Template". Copy and paste the following lines into that text box and save the settings.

Type your summary here
<span class="fullpost">
Type the rest of the post here
</span>

In your post editor, the codes above will appear when you create a new post using the Edit HTML mode. As for me, I prefer typing up my post in Edit HTML mode rather than Compose. After typing up my post, then only I go back to Compose mode to change the fonts, colors and whatnot.

That's it for now. If you've any questions or having some difficulties implementing this simple tutorial, shoot me an email. I shall get back to you ASAP! I hope this helps!

As usual, I end this post post with some news brought to you by The News Room.