MODx Web Development (ISBN: 9781847194909) is written by Antano Solar John and published by Packt Publishing. Download a free chapter (Ch 5: authentication and authorisation).

Finally, there is a book available on MODx – it’s about time! MODx is an open source PHP CMS with an awful lot going for it. While gaining in popularity, it’s nowhere near as well known as the likes of Joomla or Drupal. Hopefully, this book is the first of many on the subject and will help raise its profile and encourage more people to give it a go.

I first came across MODx over 3 years ago, when online documentation was somewhat sparse. I could see great potential in it back then, but after using it for a couple of sites, my work changed and I didn’t have a need for it. More recently, I’ve been working on more complex projects where solutions like MODx come into their own. So this book could not have come at a better time for me. With a somewhat hazy recollection of MODx, I wanted to get up to speed on the fundamentals quickly and this book helped.

This book is most suited to those new to MODx and is also appropriate for those new to content management systems in general. The pace is fairly gentle for the most part. The first three chapters (forty pages) just cover a little background and setting up a local web server (XAMPP) and getting MODx up and running.

Next comes 28 pages devoted to templates. This chapter conveys MODx’s ease of templating, one of its major strengths. You have a basic blog up and running by the end of this chapter, without the content getting technical. The book takes the approach of showing you how to get common functionality up and running, without getting bogged down in explaining what the small pieces of code needed mean. The technical details are saved for a few more advanced chapters near the end of the book. This approach frustrated me a little, since as a coder I like to know exactly what everything is doing. However, I can see the merit of this approach for a less technical audience, which is the main market for this book.

The next three chapters (56 pages) cover authentication, content aggregation (the Ditto snippet) and creating lists and navigation (the Wayfinder snippet) respectively. These are the bread and butter of most websites, and the book provides a good grounding in these techniques. Chapter 5 on Authentication and Authorisation is available as a free download from the Packt website.

As an experienced web developer, chapter 8 on snippets was where things started to get a bit more interesting. This is where some of the technical gaps left in previous chapters start to be filled in. The content is still quite accessible, focusing on explaining how to install and use snippets.

Chapter 9 introduces Place Holders Extended or PHx, which was not only new to me, but also my colleague who has built a few MODx sites recently. So, while much of the book caters for newbies, there is the odd nugget in there covering lesser known features or more advanced material.

Chapter 10 brings the focus right back to the practical, covering popular modules for adding common functionality to websites. It looks at the SMF module (for integrating MODx with a SMF forum), the MaxiGallery image gallery snippet, the built in eForm snippet for creating email forms, the WebLoginPE snippet for implementing user profiles and, finally, how to show similar articles using the old reliable Ditto snippet.

Creating Snippets is covered briefly in Chapter 11, and Chapter 13 looks at Plugins and Modules, including how to create a very simple Plugin. These chapters are both just 16 pages long and I would have preferred some more coverage on these areas. This would not be expected from a beginner book, but since it delves into more advanced topics in places, it would have been nice to see a bit more meat to the coverage.

I was delighted to see a chapter devoted to SEO, deployment and security (ch 12); all vital real world areas, but so often neglected, particularly in introductory books. Alas, aside from information on migrating your site to a live server, there is little of note here. Several general SEO guidelines are included, but I feel that the SEO advantages of using MODx relative to other content management systems, which can often cause problems with search engines, would have been more beneficial.

Another gripe is the amount of pages taken up with large excerpts of HTML code, often only differing from previous excerpts by a line or two. Surely this is overkill, even for newbies. The writing also appears somewhat formulaic or clunky in places, but in technical books, that’s less of a failing. I did notice some typos along the way too, which is more unfortunate, but most were fairly obvious.

There is a very strong MODx community, and some excellent tutorials available online. The Coding Pad has a good list of these. While many find it easy to get up and running using these resources, for others, like me, there is no substitute for a good book. Although I don’t get much time to read these days, I have a large collection of computer books.

In this context, I would describe this book as “OK”. It’s not one of those dry, complicated tomes which I never got into. It’s quite an easy read, and gives you confidence about building real websites with MODx, and perhaps even creating your own snippets if needed. On the other hand, it’s not a bible which I will refer to again and again, but that’s not its aim. Overall, while a little clumsy in places, it’s a good introduction to MODx for new users or developers looking for a refresher course.

Disclaimer: Packt Publishing kindly gave me a free copy of this book to review.

Two excellent jQuery scripts which I rely on time and time again are the Galleria image gallery and Slimbox 2, a lightweight Lightbox clone which has recently switched to using the jQuery framework over MooTools (happy days!).

Both scripts allow you to add impressive functionality to websites with very little effort. While the built in behaviour of Galleria is often ideal, I had a requirement to integrate lightbox functionality into it recently. I would consider myself a jQuery newbie, so this may not be the most elegant approach, but it seems to do the job on my browsers at least.

Galleria allows you to show a list of thumbnails, along with a larger version of one thumbnail. Clicking a different thumbnail enlarges that image instead. I needed to extend this functionality to give 3 image sizes for some of the gallery images: Clicking a thumbnail would give you a “medium” version, and clicking the medium version would show a larger version again in a lightbox pop-up.

I achieved this as follows:

1. Firstly, I made sure that I had included all the files needed by both Galleria and Slimbox in the head of my page. (The basic usage instructions on both script sites can fill you in on this.)
2. I gave any images in the gallery that needed a large lightbox version a longdesc attribute, setting it to the URL of the large version. (Not ideal semantically I know, but this attribute does expect a URL, and in this case the detailed information about the image is just a bigger, more detailed image, so I can live with that.)
3. Next, I made sure that the clickNext option in my Galleria call was set to false. The clickNext option makes each main gallery image click through to the next to provide an alternative gallery navigation to clicking each thumbnail. However, I need to have some of my main images linking to lightbox pop-ups instead, so I disable this behaviour:
   
$('#mygallery').galleria({
history : false,
clickNext : false
});

4. Here’s the key step. I used the onImage option in my Galleria call, to specify a function to add the lightbox behaviour:
   
$('#mygallery').galleria({
history : false,
clickNext : false,
onImage: function(image,caption,thumb){
//#check if thumbnail indicates that a large version of this pic is available
var large = thumb.attr('longdesc');
if(large)
{
//#if so, link to it and show it in a lightbox
image.wrap('<a href="' + large + '"></a>');
image.parent('a').slimbox();
}
}
});

   A sample onImage function is provided in the Galleria advanced demo, which gave me my function outline. The parameters give you access to the thumbnail image, the main image and the image caption, giving you great freedom to extend the functionality. Here, all I want to do is check whether the thumbnail of this main image has a longdesc specified. If so, that means it needs the lightbox effect. So, I wrap a link around the main image, linking to the large version. Finally, I make a call to the Slimbox API to add lightbox functionality to the link I just added. (Note that I first tried just putting rel=”lightbox” in the anchor tag, but this seemed to have no effect. The rel attribute may have some other purpose in the Galleria script which overrides this.)

A few short steps and you’re done. This is the kind of thing that I thought would be a nightmare. For so many years, JavaScript gave me the shudders, but jQuery makes light work of so much. I’m using it increasingly, but still only now and then, with renewed awe each time. Warning: jQuery has been known to cause giddiness and excessive drooling in web developers.

Eset anti-virus has been running like clockwork for me since I installed it 6 months ago. Until today that is.

My tray icon turned orange and I kept getting warnings that my protection was not up to date. Attempts to get the latest update failed with the scary and mysterious error message: “Undocumented Serious Error 0×101a”.

On googling for this, the top result is an official Eset knowledge base article which states that the fix is to uninstall and reinstall the Eset software.

Hmmm, I was hoping there was a less drastic solution. Luckily for me there was. I use Windows XP and just went to the Task Manager and in the processes tab, found ekrn.exe (which is the Eset software) and ended the process.

Hey Presto! My system tray icon was turquoise again and on trying to update I was informed that protection was bang up to date. Fingers crossed, it was just a blip, and Eset will go back to quietly doing its job while I hardly know it’s there.

On implementing a photo gallery using the handy Galleria jQuery plugin recently, I ran into a a couple of issues.

Firstly, the current version (1.0) does not work instantly with jQuery 1.3. You get error messages like “Syntax error, unrecognized expression: [@rel=…”. This is easily fixed. You just need to open the Galleria file and replace @rel with rel, since @rel has been deprecated (there are only a few occurrences).

Once I was up and running, I realised that I needed to do something a little bit different with this implementation. On clicking a thumbnail, I wanted to replace the content of an existing div on the page with the large version of that image.

Galleria automatically shows the large main image above your list of thumbnails. Alternatively, you can specify an element to place the large image in by specifying the _insert option:


$('.galleria ul').galleria(
{
insert: '#banner'
}


The only problem was that the div I specified (#banner in the above example) already contained some content. I wanted to replace the content with the large image, but Galleria sensibly appends the large image after any existing HTML in the element.

Another quick change to the Galleria script file seemed to change the behaviour so that the large image container HTML is overwritten instead. In the minified version, just search for _wrapper.empty().append(_img); and add the following line beneath it:


_wrapper.empty().append(_img);
/*add line below to overwrite initial non Galleria markup*/
_wrapper.prevAll().remove();
/*end edit*/
_wrapper.siblings('.caption').text(_thumb.attr('title'));