Question

I have been a Joomla developer for almost an year now. I have been struggling to import jQuery into joomla everyday. Joomla comes with mootools. When I import jQuery it crashes. Also when I create modules I have to import jQuery into each module which makes to site slow. Sometimes it makes the whole site crashes. I want both mootools and jquery to work hand in hand so I can use both without any crashes.

What’s the best way to import jQuery into Joomla ? Is there a specific place where the import should be done to use one jquery library site-wide(both backend and frontend) ?

Thanks

Answer 1

This is the code we use to ensure only 1 copy of jQuery is imported. It simply checks to see if jQuery is already being imported and if not, then we import it 🙂

Joomla 2.5

<?php
  $app = JFactory::getApplication();
  if (!$app->get('jquery'))
  {
     $app->set('jquery', true);
     JFactory::getDocument()->addScript(JUri::root() . 'templates/template_name/js/jquery.js');
  }
?>

Joomla 3.x (no conflict mode):

JHtml::_('jquery.framework');

Joomla 3.x (normal mode):

JHtml::_('jquery.framework', false);

You need to insert this code into the index.php of your template, preferably near the top so you remember where it is. If you do not wish to override your template’s index.php file, then you can also develop a small Plugin

Update:

As Bobby stated. A lot of extensions include their own copy of jQuery and a lot of them don’t use this method and thus causes conflicts. All I know is that any good developer should know that multiple jQuery libraries causes conflicts and should use this code.