Standardise jQuery loading in Joomla

03Feb

Standardise jQuery loading in Joomla

Written by Anthony Olsen Published in Bamboo Blog 3 comments

If you are familiar with our Joomla extensions, then you will know that we are huge fans of the jQuery JavaScript library. Around May 2008, and the release of the Helio template, we made the switch to jQuery from mootools as our JavaScript framework of choice for all templates and extensions. We had a few main reasons for doing this, and of course given that Joomla rolls with mootools in the core this was not a decision that we took lightly.

The main reason that we chose jQuery was the sheer fact that it is compatible with most other JavaScript frameworks if you run it in no conflict mode. This is a huge boon for the development of our extensions, given that mootools (at least when we were using it) tended to create conflicts from script to script and from version to version. While with jQuery if you stipulated that it should run in no conflict mode then it would happily coexist with any other JavaScript framework.

However there is one key issue that can cause jQuery JavaScript conflicts to occur on your Joomla site. If you have more than one version of the jQuery library loading on the page then your jQuery scripts will stop working. As more and more Joomla extensions use jQuery to implement JavaScript effects, we are seeing more and more conflicts that relate to the library loading more than once on the page.

In some cases the developers are thoughtful and provide a switch to turn jQuery off, while others arent quite so visionary and the user is left to hack the core code of the extension that loads second on the page. This of course presents an issue for the user when they need to update the extension they are using and also presents issues for users that perhaps aren't especially confident with digging through PHP or even HTML.

enter the JB Library plugin ...

To get around this we started implementing the JB library into our Joomla templates at the start of 2009. The JB Library plugin loads the jQuery library into the head of your Joomla site above where templates, modules and components load their respective jQuery scripts. Initially this free Joomla plug in only loaded the jQuery library, but each revision has seen us add a number of useful scripts to the plugin such as an IE6pngfix, lazyload image script or the back to top script. The benefit of the library is that it provides a switchable easy access source for us to load the jQuery library that is compatible with all of our templates and extensions and easy to turn off should the need arise. We also update the plugin to load recent major releases of the Jquery library in the case that your script isnt backwards compatible

What we would like to see from other third party Joomla developers who use jQuery in their extensions is a provision to turn the inclusion of the jQuery library off or if they felt so inclined to start using our JB LIbrary plugin. Im sure that this will not only lead to a reduction in support for their extensions but a reduction of support requests for us too.

Read 964 times

Anthony Olsen

Anthony is the lead designer and creative director of Joomla Bamboo.

E-mail: This e-mail address is being protected from spambots. You need JavaScript enabled to view it

More in this category: « Can you have too many module positions? New joomla bamboo affiliate banners »

3 comments

03.02.10
Nicholas K. Dionysopoulos Comment Link

Hopefully, the stable version of Joomla! 1.6 will support both MooTools and jQuery and provide us with the ability to select which library to load. Probably this will be done with an extension to JHTML (something like adding behavior.jquery). Until then, it should be taken for granted that all of us who use jQuery on our extensions should provide a toggle in the configuration parameters.

This e-mail address is being protected from spambots. You need JavaScript enabled to view it
04.02.10
Gobezu Comment Link

thank you for raising the issue

although my wishes would be a better coop between extension developers

for instance Core Design/greatjoomla.com have had scriptegrator similar to your plugin for quite a while and he is doing great jQuery based extensions as well

hope you consider the path of cooping and becoming a voice for some good change in this regard

This e-mail address is being protected from spambots. You need JavaScript enabled to view it
04.02.10
Anthony Olsen Comment Link

Hey folks,

Yes it certainly sounds like there needs to be some unification in regards to this although if its all handled at the plugin level then you can just publish and unpublish the necessary plugins.

I guess it gets complex when we take into consideration the extra scripts (ie6pngfix, scrollto etc). In the next update of JB LIbrary we will have the option to toggle jQuery off as well in case it needs to be used with a plugin like the script aggregator.

@Gobezu thanks for the tip on Greatjoomla.com wasnt aware of that one.

This e-mail address is being protected from spambots. You need JavaScript enabled to view it