WP-ShowHide: Embed Text Within Your Posts With A Show/Hide Link

If you’re an experienced WordPress user, you may have heard of Lester Chan (otherwise known as “gamerz”). Lester is the author of no less than 19 plugins, of which 4 feature on the WPMU Top 100 Plugins list.

That’s more than the likes of Joost de Valk, Automattic, or anyone else for that matter.

I recently interviewed Lester for ManageWP, and so had the opportunity to take a closer look at all of his plugins. One that caught my attention in particular was WP-ShowHide. It is very simple, but what it does, it does well.

The idea for WP-ShowHide came from the way in which Engadget embeds press releases within posts (here’s an example). And whilst the plugin certainly can be used to present press releases in that manner, it can also be used to embed and show/hide any form of text.

How Does It Work?

Using WP-ShowHide couldn’t be any simpler – just wrap the text you want to embed in [showhide][/showhide] tags, and readers will see the following:

If a visitor clicks on the link, the text appears seamlessly, and the link text changes accordingly:

As you can see, I am using the trusty T’Lipsum Generator for my dummy text (I’ll take any excuse to plug it).

By default, the shortcode assumes that you are embedding a press release. However, you can define a few different variables from within the shortcode to control settings:

• type – if you want to include more than one block of embedded text within a post, you need to name each one using this variable.
• more_text – use this variable to define the text that is displayed when the embedded content is hidden. Include “%s” to display a word count.
• less_text – conversely, use this variable to define the text that is displayed when the embedded content is displayed.
• hidden – define as yes/no to determine whether the embedded content is displayed or hidden (by default, it is hidden).

Here’s an example using all of the above variables:

{code type=”html”}

[showhide type=”podcast” more_text=”Show Podcast Transcript (%s words)” less_text=”Hide Podcast Transcript” hidden=”yes”](Podcast Transcript)[/showhide]

 

And here is the end result:

That’s it! There are multiple potential applications for WP-ShowHide – how will you use it?

Download WP-ShowHide here.

Creative Commons image courtesy of Ernst Vikne