Joomla is one of the top three most popular open source content management systems (CMS) in use on the Web.
Unfortunately, it’s default JavaScript library is Mootools, whereas the most popular library for most designers is jQuery. But despair not. It is quite easy to add jQuery into your into your Joomla site and start tapping into all that jQuery goodness once again.
The following has been tested on Joomla 1.5 so mileage may vary but probably also works on later versions.
1) You’ll need to open up the index.php Joomla file in a text editor. The file can be found in whatever theme folder is currently your default.
2) Add these lines of code:
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.6.1");</script>
<!--Added Google Library javascript-->
immediately before the
<jdoc:include type="head" />
You should now have jQuery running on your page.
If you have Firefox with the FireBug extension, you can test
it by cache refreshing your Joomla Homepage (Ctrl + F5),
opening Firebug (F12), and testing the jQuery version
Open up Firebug.
Click on Console.
Enter the command,
jQuery.fn.jquery
Click Run.
You should see
>>> jQuery.fn.jquery"1.6.1"
or similar on the left of the screen.
Hail the mighty Fox!
This approach uses the Google API JavaScript library rather
than downloading and installing your own version of jQuery.
Why it’s best practice.
a) You are getting a compressed version of jQuery (17KB instead of about 80KB)
b) Parallel downloading the library speeds your page load time
c) Fair chance the user already has the Google jQuery file cached in their
browser. More and more developers are taking the same approach.
