I’ve recently been looking at ways to enhance certain content types that we deliver through Jadu CMS, my focus at the moment has been through the use of images within content, whether that be News, Events, Documents or Homepages. This started with a re-alignment of the news section on the University of Leeds’ corporate website.
Multiple image sizes
We’ve traditionally been hampered by the fact that Jadu doesn’t yet have the ability to generate multiple image sizes from a single base image so if I wanted to have a large document level image, and a smaller thumbnail within a list view, I’d either have to resize with CSS which results in degraded image quality in some browsers, or have the editors upload multiple versions of each image to the CMS and figure some way to switch between these programatically. Neither of these options were desirable, so we built an image helper that, instead of inserting the ! element directly into the front end script, we pass the image name to the helper, along with the desired attributes such as a specific height and/or width, the helper then resizes the native image, and caches it for future use.
we can now elegantly deliver multiple image sizes depending on our needs, without either the bandwidth overhead of resizing large images, or the administration headache of managing multiple images within the CMS
The next issue I’ve been looking into recently is that of image attribution, again, Jadu doesn’t currently have any options within the multimedia gallery module to attach attribution data to multimedia items. If the UoL wants to use a Creative Commons licensed image, there’s no way, other than adding the attribution data into the body content. I figured there was a better way to do this.
The Multimedia Module within Jadu is the central place to manage all types of multimedia content, for this example I’ll focus on images. One of the core concepts of a CMS is that an image only needs to exist once, but can then be included in any other piece of content. The multimedia manager is a relatively recent addition to Jadu CMS, and as such, provides the bare minimum of features required so I needed to find a way to link attribution data to an image without modifying the core CMS code.
Enter machine tags
As we can apply tags to each image, this was a perfect place to use machine tags – a piece of text which contains machine-readable semantic information – to include the relevant licensing information. Machine tags are composed of three parts; a namespace, a predicate, and a value. For example:
license:creativecommons="© 2009 Greg Grossmeier, used under a Creative
Commons Attribution-ShareAlike license:
So, armed with our enlarged tag column, I set about writing a function which would parse an images’ tags for our license machine tag, extract the relevant components, and spit out some meaningful markup to the browser which we could style as needed. You can get the Image License function from GitHub, in case it’s of use to anyone.
Here’s the attribution implemented on our document image component:
Low impact development
Working in this way, we’re able to extend the functionality of the CMS without modifying the core product (which would complicate our upgrade cycle) because we’re making the assumption that these features will eventually be provided natively within the CMS. These functions enhance how we manage and use images, yet are lightweight enough to be stripped out and replaced by native functions if and when they become available.