Plugin review – Better WP ShowHide Elements

Doodle of a concertina plugin

The excerpt pages on one of my other blogs was getting clogged up with showing the categories applied to a post, rather than the summary of the post.

Now, there are good reasons (which I won’t go into now) why I needed long category names (and why I needed to cross-post into a number of categories) but they were taking up 4 lines, while the excerpt was a one- or two-liner. So I was looking for a javascript show/hide plugin. Bullet points :

  • I could have built one myself (I’ve done something similar elsewhere) but why should I reinvent the wheel ?
  • There are shortcode plugins around, but that adds a bit of overhead (it gets interpreted when the page loads).
    And all of those overheads tend to accumulate.
    A shortcode solution might have been a good choice if I’d wanted the show/hide in the post content, but I wanted to integrate these collapsing sections at a template level.
    (I’m already using the BNS Inline Asides plugin to do something similar inside posts)

The only one that really fitted the bill was Andrew Kennedy’s Better WP ShowHide Elements plugin. This was only released recently (less than two weeks ago, as I write), and hasn’t got a lot of downloads logged, but the code shouldn’t be too volatile, so I figured it’d be worth the risk. The version installed was 0.2, so it’s still early days.

Ease of Use

I’d give this plugin a difficulty factor of “medium” – it isn’t as easy as a shortcode, but if you’re comfortable dabbling with theme templates (php, HTML and CSS) then it shouldn’t pose any problems. (This “difficulty factor” shouldn’t be seen as a criticism of the plugin; it’s just an indication of the target users).

There’s not a lot of documentation. But, to be honest, it doesn’t really need much. I built this functionality in to the templates of a child theme I’m using with PortfolioPress (the same core template I’m using with this site).

I did have a bit of a glitch on installing – the files (from the automatic install) extracted to a different folder than the header code expected. Once I figured this out, it just needed a rename. As soon as I’d tracked that down, the code started working just fine.

Example / Case Study

I’ve a theme template that handles all my archive pages – called “excerpt.php” – so I put the code in there

As I’ve got a number of excerpts on each page – each with its own categories – I needed to make sure that only category section has a unique id. So the only thing that’s a bit different from Andrew’s demo is that I’ve including a bit of php that uses WordPress’ post ID tag.

Anyway – here’s the commented code … you may, of course, need to change things a bit to fit in with your theme. And although I’ve applied this to categories, you can apply it to tags (for example) – or any other untidy (but occasionally useful) sections of your site.

<p class="cat-show-link">
<!-- this is the standard plugin code, except for the identifier -->
<a onclick="wp_showhide.main(this, 'cat-<?php the_ID();?>')" href="javascript:void(0)">["Show Categories", "Hide Categories", "hidden"]</a></p>
<!-- setup a unique id for this article -->
<div id="cat-<?php the_ID() ;?>" style="display: none;">
<p class="cat-links-excerpt">
<?php the_category( ', ' ); ?></p>
</div>
<!-- end of the collapsing section -->

Leave a Reply