johnmccollum.co.uk

CMS Made Simple is the best content management system you’ve never heard of.

Version 1.4 brings a much needed redesign of the admin area, as well as numerous performance and stability tweaks.

As I mentioned before, no-one wants a static site anymore; I believe CMS Made Simple offers the simplest content management solution today.

Why do I love it?

• Any type of layout achievable with CSS is achievable with CMS Made Simple
• Completely table-less setup. (Assuming that’s what you want)
• Focus on accessibility; more so than most other CMS’
• Fine control over what administrators can and can’t do
• Easiest admin area imaginable

But what I really love about it is the speed at which users pick up the knowledge they need to run their site. Most training sessions for CMS Made Simple run at about 30-45 minutes, and not one person has had to come back for further training.

By contrast, I’ve seen training sessions for other CMS’ run into several hours, with repeat sessions required before they decide to delegate it to someone else anyway!

Having said all that, it isn’t perfect for every site; some of the extensions are of…dubious quality, so if a forum, e-commerce, or front-end login facility is required, I would go with another solution.

Having to edit the template in the browser window is also an annoyance, and I don’t favour the smarty templating system, but for small-medium formerly static sites, it can’t be beaten.

So please, check it out and spread the word!

Yahoo have a hard time fighting off the image of being bridesmaid to Google’s bride. However, they have a decided knack for turning out really cool developer toys! For example, check out the Yahoo User Interface library, Yahoo Pipes, or their latest baby, Yahoo BOSS.

Short for ‘Build your Own Search Service’, Yahoo have pretty much opened up their entire search service via an API. With an unrestricted number of queries, and complete control over presentation of results, you can really go to town with this one!

Getting started is easy; simply get yourself an API key here. Go on, I’ll wait.

With that done, anyone with basic knowledge of PHP and JQuery can easily build a search application!

Check out my demonstration here.

There are two pages involved in this demonstration. The first page displays the form, and contains the necessary JQuery code to fire off an AJAX request to the second page. The second page takes the posted value, fires off a request to the API, and returns the result.

Without further ado, here’s the JQuery:

    $(document).ready(function(){
      $('#results').hide();

      $('#search').click(function(){
        $('#results').hide();
        searchterm = $('#searchterm').val();
        $.post('getresult.php', {query: searchterm}, function(data){
          $('#results').html(data).show('slow');
        });
      })
    })

Nothing too horrendous here; hide the results division, grab the term to be searched for, fire off an AJAX request, and put the returned data in the results div. Show it slloooooowly.

The code in ‘getresult.php’ isn’t much more complex; you can see it here.

That’s all there is to it! (At least for this very basic example.)

Once again, you can see a demonstration here.

I’m sure there must be loads of ideas for mashups out there; let’s hear some of your thoughts!

I’ve had some fun this weekend tinkering with Jquery. It’s taken me a long time to get round to playing with this library, having thrown my eggs in the Prototype / Scriptaculous basket, but after some experimentation, I wish I’d done it sooner!

I have to admit; the syntax is nicer, much simpler (no more $$(’selector’)) and the documentation seems better. Jquery is also lightweight and fast.

To celebrate my switchover, here’s a very simple Jquery menu demonstration!

Let’s start off with the HTML:

<div id="”content”">
<ul id="”menu”">
  <li class="”starter”&gt;menu"></li>
  <li><a href="”#”">home</a></li>
  <li><a href="”#”">about us</a></li>
  <li>a href=”#”&gt;portfolio</li>
  <li><a href="”#”">contact us</a></li>
</ul>
</div>

It doesn’t get much simpler than this! An ordered list, ready for styling. Not much to see here. Here comes the javascript:

$(document).ready(function(){
  $("li:not(:first)").hide();

  $("li.starter").click(function(){
    if($("li:not(:first)").is(":visible")){
        $("li:not(:first)").fadeOut("fast");
    }else{
        $("li:not(:first)").fadeIn("fast");
    }
  })
})

Eek! Slightly more complicated. Let’s walk through it.

$(document).ready(function(){

Before we do anything, we make sure that the DOM is ready for manipulation. This has a handy side effect, when we see the next line:

$("li:not(:first)").hide();

This piece of code looks for all the ‘li’ elements in the page (disregarding the first one) and hides them, using display:none. The great thing is, since we’re doing this within $(document).ready, users with javascript switched off will still see the menu!

$("li.starter").click(function(){

This tells the browser to look out for any clicks on the li.starter element, and use the next bit of code to handle it.

if($("li:not(:first)").is(":visible")){
    $("li:not(:first)").fadeOut("fast");
}else{
    $("li:not(:first)").fadeIn("fast");
}

This part checks to see if the list items are visible, and shows them or hides them as appropriate.

You can see the full demonstration here, with comments!

I was recently working on a Joomla! site which required a fairly unusual banner management system. The spec was that the user would be able to enter a list of banners, links, start dates and expiry dates, and that these banners would be displayed in a random order in the main content area. The component will accept all major image formats, and flash movie files. (.swf)

I wasted quite a bit of time trying to mold other components to my needs, but I could have saved myself some time if I had just written my own!

Here we are, then; the result of my labour.

This component requires Joomla 1.5 or later.

LICENSE + DISCLAIMER:Copyright 2008 John McCollum. This program is free software; you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation; either version 2 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program; if not, write to the Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.

By downloading this component, you are indicating your acceptance of the terms above. Please make sure you back up your files and database before installing this component.

Click here to download the component!

EDIT - by popular demand, I’ve written a simple module to interact with this component. It simply loads a random image or .swf into a module position, based on dates supplied by the user. Note - you must download the component to use the module, although you can use the component on its own!

Click here to download the module!

As I mentioned before, I made the switch to GNU/Linux at home some time ago. I talked about the benefits it brought me in terms of PC performance and productivity.

But at work, I’m still firmly rooted in the Windows camp. Why? Primarily because my job involves developing web sites and apps.

Tracking browser usage is a notoriously haphazard affair. According to the much-quoted W3C schools statistics, roughly 53% of users are using Internet Explorer. According to wikipedia, that number is nearly 75%.

Given internet explorer’s ‘unusual’ implementation of web standards - not to mention its market share - it is a necessity to test on these browsers. This is where things get a bit tricky for users of minority operating systems such as Linux, or OSX.

Sure, there are services such as Browsershots which take snapshots of sites using particular browsers, but if you’re anything like me, developing for IE is an iterative process. Make a change, hit refresh. Make a change, hit refresh. Waiting 3-30 minutes to see an update isn’t an option!

I’d be interested to hear comments from anyone who has found a way round this issue.