Freshly Baked I first created a custom categories widget for Shopp last year. It was a solution to a very particular problem, which went something like this: let’s say you have a Brands category and you wish to display a list of all the sub-categories of Brands, but not the parent itself, how can you do that and place it in the sidebar?
A convenient tool to list categories
Without resorting to custom code and template tags, which many people are unfamiliar with, there was no easy way of achieving this. My widget resolved this issue and was great in various other scenarios too – in all honesty it did however suffer from a number of issues.
- It featured an overly complicated user interface (in the widgets admin screen)
- Merchants had to be comfortable with the process of retrieving category IDs which many found to be neither intuitive nor convenient
- They then had to choose a load of options such as Ignore Parent Categories or Include Children and maintain an idea in their head as to how this would all pan out
- Though it could produce hierarchical lists it didn’t handle orphaned children very well
The latest version, 0.5.4, aims to tackle a whole heap of these issues. The rest of this post is going to explore that in a little more detail. If you’re really here because you want to get your hands on the widget, then simply head on over to Google Code and download it! Like any other WordPress plugin you can simply upload the zip archive from the comfort of the plugin manager. Update: now available on WordPress Extend.
Simplified User Interface
No need to know the ID, simply place a check-mark beside the category name and you’re done
In the previous versions of this widget you had to build lists of categories to include and exclude. This had to be a list of category IDs, separated by commas.
So how do you determine a category ID? One approach is to open the category for editing, inspect the URL and look at the value of id in the URL query. Of course, that makes for a simply awful user experience and it was compounded by the fact that users where then required to form the IDs into a comma separated list.
Surprisingly, this is not an uncommon pattern for many WordPress widgets (and other plugins). It certainly makes life easier for the plugin author, but is frustrating and unnecessary for many end-users.
With version 0.5.4 all you need to do is find the category name and check the checkbox: this provides what I hope is a far better balance between the high degree of control offered in previous versions of the widget and the simplicity of the standard Shopp category widget.
As before, you can choose between four different output styles:
- Flat, unordered list (bullet points)
- Hierarchical unordered list
- Dropdown list (an HTML select element)
- A dropdown with hierarchical markings
You also have a choice of linking to empty categories (those that contain no products) or not – all in all I hope this provides all the control that you require without being an uncomfortable experience.
Orphaned Children
Categories are a hierarchical structure: any given category can contain sub-categories, which can contain sub-sub-categories. If arbitrary categories can be included in a single list – which this widget allows – that presents a bit of a problem when the time comes to produce hierarchically formatted output.
In former versions I “worked around” this by including a caveat that hierarchical formatting may produce unexpected results. Not only did I consequently receive several awards for laziness, but the widget was then prone to producing invalid HTML. This time round I’ve tried hard to resolve this problem.
The question is how do we re-map this so that the Clothing category is not orphaned? Promoting it so it is a direct child of Sports Equipment is the path taken by this widget.
The strategy I plumped for was to promote orphans until either they have a direct connection with a descendant which has also been selected for inclusion or, if none of its parents, grandparents or great-grandparents have been included then it is promoted to the root level of the structure.
You can support the upkeep of this plugin (and encourage me to fix things) by buying me a beer! Just click on the image to head over to PayPal.
This flattens things out somewhat but still preserves what hierarchy it can – and apart from producing cleaner, more easily understood output it should also result in 100% valid HTML.
Feedback Always Welcome!
Problems and suggestions for improvement are more than welcome – feel free to make use of the issue tracker over at Google Code if something is broken.
Finally, please bear in mind that this is the first release of the plugin in a Shopp 1.2 compatible form and it has largely been rewritten to achieve this, so don’t be surprised if there are some niggling problems that occur in real world usage. Don’t get angry though, just let me know!
