How to Show and Hide Text in Blog Post with teaser

Here is how to show and hide text in blog post with something like 300 words teaser before the link to read the rest of the story...

This post is already the example to show that it is possible to use the same technique in my previous show/hide blog post article to have a teaser before the link to show the rest of the story.

What I've done here is just placing the "span" tags at the right position where i wanted it to be. To make it short and clear, here is the sample template to this kind of blog post...


This post is already the example to show that it is possible to use the same technique in my previous show/hide blog post article to have a teaser before the link to show the rest of the story.

What I've done here is just placing the "span" tags at the right position where i wanted it to be. To make it short and clear, here is the sample template to this kind of blog post...

--- Place your 300 words teaser here ---
 <span class="postshown" id="your-topic-link-id-0001">

Click here for more...</a></span>

<span class="posthidden" id="your-topic-id-0001">

--- place the rest of your story here ---

</span>

Here's the screenshot of where exactly you should place all these codes and text:

Done! that's all it takes to do it assuming you have already follow the necessary steps on editing the CSS and everything before making the blog post. Good Luck!

Categories: Html, hyperlink