Javascript is widely used within Joomla frontend extensions including templates. Unfortunately Javascript conflicts can occur between different extensions. This becomes more likely with every extension that is installed and can become an issue if you rely heavely on a large number of Joomla extensions. If you are new to using Joomla you may have noticed that jQuery is generally loaded by default however this was not always the case. Prior to Joomla 3.x Mootools was the primary Javascript library that was used. Because of this some extensions continue to use Mootools which can be a common source of conflict with the now default jQuery Javascript library.

Conflicts can also occur if an extension trys to load it's own copy of jQuery. Considering jQuery was not always available within Joomla, this is still quite common. Third party extensions are no longer required to load jQuery as it is already included with Joomla! Not only does loading jQuery twice increases the chance of causing conflicts it also added to the load time of your site.

Detecting Javascript Errors

If you suspect that your site is not functioning as it should then it is time to consider checking for Javascript error. A common example within Joomla51 templates is the mobile menu menu not functioning correctly as this is rendered using Javascript (eg. no sub menu items been displayed). So where does one check for such erros? The anwser to this question lies in your browser Javascript console. Most modern browsers include tools to view the Javascript console where in the past such tools like Firebug had been used instead. Hitting F12 or right clicking anywhere within a page and selecting 'Inspect' should bring up your developer tools. Within these tools select 'Console'. This console will display any Javascript errors on your page if they exist. Javascript Console

Installing 'jQuery Easy'

'jQuery Easy' is a free and excellent tool in helping resolve some of the common Javascript conflicts. Following are some of the many features available within 'jQuery Easy' to aid resolving your Javescript errors.

  • Ensure jQuery is only loaded once throughout your site
  • Puts jQuerry into no-conflict mode
  • Places jQuery libraries after MooTools calls for better compatibility

For a basic installation of jQuery Easy follow these simple few steps..

  1. Download 'jQuery Easy' (http://www.simplifyyourweb.com/downloads/jquery-easy#downloads)
  2. From your Joomla adminstration navigate to Extensions -> Manage -> Install -> Upload Package File
  3. Click Browse and select your downloaded copy of 'jQuery Easy' and install
  4. Navigate to Extensions -> Plugins and select System - jQuery Easy
  5. In the Plugin tab set Status to Enabled Enable plugin
  6. In the Basic Site Options set the Enable jQuery option to jQuery Enable jQuery
  7. Hit Save & Close

You now have 'jQuery Easy' installed with a basic setup which will hopefully go a long way in resolving your Javascript conflicts!

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters
the trademark holder in the United States and other countries.

We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies). You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.

Ok