Skip to Content Skip to Search Go to Main Navigation Go to Blog Navigation

Monomo Interaction Design



Postings under ‘WordPress’

Liquorice Allsorts

Lots of Liquorice Allsorts
Powered by the incredible forces of a late spring, we thought it is about time to breathe some fresh air into the WordPress world of themes.

We present Liquorice Allsorts as a solid base of a theme for WordPress and we want to encourage its users to change and customise it in any possible way. And this wish of ours informed very much how Liquorice Allsorts has been designed and constructed: Liquorice Allsorts is bold, fresh, direct and … the perfect antidote to drop shadows.

Liquorice Allsorts Screenshot

Ranging from small improvements like the addition of microformats to the introduction of a shortcut menu potentially useful for disabled users and the use on mobile devices, we added a couple of bits which should make you, the user, very happy and encourage you to have a go on your own.

Liquorice Allsorts is edgy – and it does want you not to stop expressing your own self by simply choosing it as a theme, but wants to encourage you to have a go. It is much easier than you might think. Make this world a bit more colourful and do your own thing!

Have fun!

Optimised Comment Form v1.0

Optimised Comment Form v1.0 is a small improvement of the comment form which comes with the default theme “Kubrick” initially developed by Michael Heilemann for WordPress. From the “Default” Theme the markup and subsequent handling of CSS of the comment form had been passed on to several other themes, like the very neat K2 Theme. So to add a bit to the diversity, we thought we put this little snippet up.

If you are developing your own theme for WordPress or you are designing your very own blog, then you might want to have a bit more freedom in how the comment form appears on screen and might push it a little bit in terms of accessibility. This is particularly interesting if you are working with fluid layouts.
Since making online forms work (in terms of look and usability) can easily become tedious, we thought … to maybe save you some time.

Download Optimised Comment Form v1.0

DownloadDownload Optimised Comment Form v1.0

Optimised Comment Form v1.0 Characteristics

  • Tab Order change - tabindex reordered: presumably the search input form features before the comment form in most blogs. Therefore the starting of tabbing in the comment form doesn’t seem to be appropriate – especially since there might be more elements being more important to be tabbed to before ;-)
    Therefore the tab order starts at 50 and then increases by 5 in order to allow additional plugins, like for instance Spam Protection, to be integrated.
  • fieldset and legend Tags added: In order to push towards clearer and recommended form layout - making handling easier on various devices, especially if there is no CSS in place.
  • label Position Change: The position of the labels has been changed. Improves readability (left – to – right in the western hemisphere).
  • span replaces small: In terms of semantic Markup we thought span would be more appropriate.
  • Adding of title Attribute: Each input field and the textarea carries a meaningful title attribute.
  • Additional Containers: two containers in the form of divs have been added in order to allow the maximum of freedom to style and improve usability of the form on all common browsers.

What do I do with this?

  1. Download and unzip OptimisedCommentForm.zip
  2. If you’re working with the default installation of WordPress simply copy and overwrite the comments.php in the ‘/default/’ directory. If you have already customised your comments.php you will have to amend the file manually in order not to lose your changes.
  3. There are two css files within the unzipped directory. Again if you are using the default WordPress installation simply overwrite style.css in the ‘/default/’ directory. If you are using customised css you can use the optimised_form.css as a starting point to amend your stylesheet. Hint: you might have to alter the interdependence of width and margin values in order to have the perfect fit for your layout.

Important Notice

The sticky usability problem that users have to navigate back to the post page, whenever there is a wrong input remains. That error handling is managed outside the reach of themes and hence would need to be addressed by the core of WordPress. So if you don’t want to go down the heavy customisation route you might want to consider to lobby the nice guys from WordPress and contribute to their great project.