Are you enjoying the extensions? Did you like the support? Help others decide.

Leave a review

21Oct2021
Information
Print

Use jQuery Easy to: load libraries from the cloud

Information
First published October 20, 2021
211 hits

One basic reason you would install jQuery Easy would be to load jQuery and/or Bootstrap libraries from the internet, through a CDN (or Content Delivery Network). That has the advantage to load libraries that are not necessarily available in the version of Joomla you are using from an outsourced server that is optimized to deliver them.

You can check this FAQ for more information about CDNs.

In this tutorial, we will replace the jQuery library with jQuery 3.6.0, loaded from the Google CDN.

Go to the plugins section of the Joomla administrator site.
In the search box, type 'jQuery'.
Access the System - jQuery Easy plugin.

Profiles For site-wide changes, set up the System - jQuery Easy Profiles plugin. To target your changes to specific pages, create an instance of the jQuery Easy Profile module instead.

Go to the General Options tab.

Set the Page Scan parameter.

In Joomla 3, the page is automatically scanned for jQuery library duplicates. If you do have duplicates on your site, choose the option that corresponds to your situation. Most likely (if all the site's extensions and template load jQuery through Joomla's API), set Page Scan to API. If you find pages that have the jQuery library loaded inside the <body> tag, set Page Scan to <head> + <body>.

[Coming soon] In Joomla 4, if you have no issue with duplicates, you can prevent any scanning by setting Page Scan to None.

Page scan set to none
Page scan set to None

Set the Protocole parameter. You can leave the default selection (for secure sites), but you may also want to set it to None. It is basically telling the CDN to choose which protocole is the most appropriate for your site.

You can leave all parameters in the Specific Assignments tab to Ignore. This will enable the plugin for all the pages of the site. If you want to restrict your changes to specific pages of the site, use the available options.

Profiles If you need more ways to target the pages, use jQuery Easy Profiles to setup multiple profiles through module instances. 

Go to the jQuery tab.

Select the jQuery library.

jQuery selection
Selecting jQuery

Set the Version to 3.6.x. Set the Sub-Version to 0. Note that if missing, the sub-version defaults to '0', always.

jQuery version
Setting the jQuery version

In Joomla 3, you can specify if you want to add the jQuery library to all pages no matter what or only on pages that have jQuery already present. Use the parameter Add When Missing for that purpose.

[Coming soon] In Joomla 4, the version of jQuery you have selected replaces the active jQuery web asset's URL. Therefore, if jQuery is loaded on your site through other means (other than through web assets), you will have to allow the plugin to scan your pages (do not set Page Scan to None) or else you will end up with duplicates.  

Now, your site is loading jQuery v3.6.0 from the Google CDN.

Profiles You can set a CDN other than Google as default.