Blog

Analytics and Consent Integration for Joomla.

Welcome to Google Consent Mode v2 and its integration with Eorisis Analytics and Consent Joomla extensions. These latest updates empower your Joomla website to manage user consent efficiently, ensuring compliance with GDPR and other privacy regulations while optimizing your site's analytics for GA4/Google Tag and Google Tag Manager.

Consent mode lets you communicate your users' cookie or app identifier consent status to Google. Tags adjust their behavior and respect users' choices. Consent mode receives your users' consent choices from your Consent banner and dynamically adapts the behavior of Analytics, Ads, and third-party tags that create or read cookies.

Note: This solution is fully hosted on your server, ensuring complete control and privacy. You connect directly to your Google accounts, without relying on any third-party SaaS services.

Key Configuration Options:

• Analytics Storage: Enables storage (such as cookies) related to analytics e.g. visit duration.
• Security Storage: Enables storage related to security such as authentication functionality, fraud prevention, and other user protection.
• Functionality Storage: Enables storage that supports the functionality of the website or app e.g. language settings.
• Personalization Storage: Enables storage related to personalization e.g. video recommendations.
• Ad User Data: Sets consent for sending user data related to advertising to Google.
• Ad Personalization: Sets consent for personalized advertising.
• Ad Storage: Enables storage (such as cookies) related to advertising.

Exclusive Measurement and Privacy Features:

• Geotargeting: Utilize Traffic Filters (requires Cloudflare).
• Retain Cookies: Choose to retain or delete cookies based on user consent.
• Retain Code: Opt to keep the tracking code on the page (or not) depending on user consent.

Enhance your websites and user trust.
Add Consent Mode v2 to your Joomla sites now.

Download Eorisis Analytics
Download Eorisis Consent

The lastest updates that have been released on October 19, 2022 on all Joomla extensions and WordPress plugins, ensure compatibility with the upcoming Joomla 5 and 4.3, as well as the upcoming version of PHP 8.2. This allows you to upgrade your server versions of Joomla and PHP without fear. Note that the minimum PHP version for Joomla 5 is 7.2.5.

Eorisis extensions are hybrid, so you do not need to uninstall or reinstall any Eorisis extension when upgrading from Joomla 3x to 4 or 5, assuming they are up-to-date. TIP: When upgrading to Joomla 5 or 4 from earlier Joomla versions, increase the Session Lifetime (in Joomla configuration), as the update can take a long time on some systems.

Joomla Demos
Joomla Extensions

I am proud to let you know that all Eorisis extensions are Joomla 4 compatible and ready to use. Joomla 4 was released on August 17, 2021. The first Eorisis update covering Joomla 4 compatibility was released in 2017 (November 22), followed by numerous updates and continuous development to date.

Of course this is not going to stop.

Joomla 4 developers made constant changes to the core. Staying up-to-date with the latest Alpha, Beta and RC versions required constant changes to the extensions.

Eorisis extensions are hybrid, so you do not need to uninstall or reinstall any Eorisis extension when upgrading from Joomla 2x or 3x to 4, assuming they are up-to-date. One tip I could give when upgrading to Joomla 4, would be to increase the Session Lifetime (in Joomla configuration), as the update can take a long time on some systems.

We love progress and we are ready.
Your feedback is welcome, if you have any questions, do not hesitate to contact support.
Stay safe and enjoy Joomla 4.

Joomla Demos
Joomla Extensions

In this tutorial we will setup a fresh Xubuntu Operating System on our computer. Xubuntu is one of the most lightweight operating systems you can install, while it is a fully capable, expandable and easy to use environment. If you want your computer to run an OS as minimal and fast as possible while having the full power and security of Linux, Xubuntu is one of the best choices. Some laptops on the ISS run it and we would all agree that the choices for the space station are special. The tutorial will cover all the setup process for a full system format.

Note: There will be additional tutorials on how to customize and configure your new system and install extra software.

Xubuntu 16.04 (Xenial Xerus) was released in April 21, 2016, it is free open source, comes with Xfce, which is a stable, light and configurable desktop environment. It is recommended for novice users up to advanced developers. If you plan to set this up on a very old computer, you have a big chance to resurrect it -- this system is extremely fast. The LTS release (Long Term Support) is supported until April 2019 and is the recommended version for all environments that require stability.

Note: If you have minimal or no experience with a Linux system you may of course find it strange at first, but that's normal. All you need is the will to learn something new, especially when it is something like this. Remember it may look like Windows but it is not, it is far ahead, so it will need your attention.

ISO Download & Burn

First we will need the installation ISO image file so we can create a DVD.
Download it for free from https://xubuntu.org/download/
(Choose 64bit or 32bit depending on your computer architecture)

Once downloaded, it is recommended to burn the image file to a DVD and not a USB. Various programs that promise a good USB result have issues -- but there are two good ones I can recommend:
If you are on Linux already, use: UNetbootin
If you are on Windows, use: LinuxLive USB Creator

It is now time to burn the ISO.
When your medium (DVD or USB) is ready, you may need to enter your BIOS setup Boot Options and make sure that you can boot from DVD or USB if needed.

Installation

Note: If you use a Wi-FI there will be an extra step in the process below. Take the time to enter your Wi-Fi information at that point.


Step 1.
Start the computer that you have planned to install the system on, with the installation DVD or USB on it.
When your computer starts you will first see the boot screen.




Step 2.
At this point, the Welcome screen appears.
Select the language from the left side, and then click on the Install Xubuntu button on the right side of your screen.




Step 3.
In this next step, click the checkbox Install third-party software for graphics and Wi-Fi hardware, Flash, MP3 and other media.
You can leave the Download updates while installing Xubuntu unchecked so that we can install the updates afterwards.
This will make sure we install the system faster. Click the Continue button.




Step 4.
Now we will choose how we want the hard drive to be formated.
Make sure that the Erase disk and install Xubuntu is selected.
Click on the checkbox Use LVM with the new Xubuntu installation.
Warning: This will format the whole hard drive on the computer and create it's own partitions needed. Any data on this drive will be wiped out.
Click the Install Now button.




Step 5.
A window opens with information about the changes that will occur to the disk.
Confirm by clicking on the Continue button.




Step 6.
At this point the system has started copying files in the background. While it is doing this, we will be asked some questions.
Select your Time Zone / location by clicking on the world map -- if it is not correctly guessed already.
You can also type it in the text field below the map.
Click the Continue button.




Step 7.
Next is the Keyboard Layout setup.
Select the desired language and then click on the Continue button.
Note that you can also change the system language after installation.




Step 8.
Last, your computer user information.
Type in Your Name, set a name for your computer, pick a Username, and set a Password (twice).
When it all looks good, click on the Continue button.




Step 9.
The system will now continue the installation without any more questions.
There will be only two more things to do before the very end.
Just sit back and watch for a little bit.





Step 10.
When this window appears, the installation has finished and you are asked to restart the computer.
You should not take the DVD or USB out yet.
Click on the Restart Now button.




Step 11.
When you see this screen, it is now the time to remove the DVD or USB stick from the computer.
When removed, hit ENTER on your keyboard.
The system will reboot.





Step 12.
This was the first system boot.
When you see this screen (the login screen) you can login to your new system.





Step 13.
After you login, the first thing to do is update the system.
On the upper left corner of your screen there is a blue icon, click on it. The main system menu opens.




Step 14.
Type the word update.
Click on the Software Updater from the list.
This will open the update application and find new updates to install.





Step 15.
Once updates are found, the following window will appear.
These are the ones we didn't install during the installation process.
Click on the Install Now button of this window.




Step 16.
You will be asked for your password.
Linux will always ask for your password when you want to make changes to the system such as when installing updates or other software.





Step 17.
After installing all the updates, the system may ask you to reboot such as seen on the following screen.
You must restart your computer in this case, otherwise there is no need for it.
Let's restart the computer in this tutorial. Click on the Restart Now button.





Your new Linux system is ready. Login to it.




Let's make it look a little nicer.
Right click on the desktop and select Desktop Settings.




Select a wallpaper that you like and just close that window.




It's all yours.
Enjoy your new Linux system. Be creative.

In this tutorial we will setup a fresh Kubuntu Operating System on our computer. Kubuntu is user friendly, has one of the most advanced desktop environments and is one of the best and most advanced operating systems for your desktop or laptop. The tutorial will cover all the setup process for a full system format.

Kubuntu Linux 16.04 LTS (Xenial Xerus) was released in April 21, 2016, it is free open source and it ships with the new KDE Plasma 5 desktop environment. It is recommended for novice users up to advanced developers. Note that if you plan to set this up on a very old computer you should know that it is not considered lightweight, although you have extreme customization options (soon with tutorial), and it runs fine on a 15 year old laptop I have.

Note: If you have minimal or no experience with a Linux system you may of course find it strange at first, but that's normal. All you need is the will to learn something new, especially when it is something like this. Remember it may look like Windows but it is not, it is far ahead, so it will need your attention.

ISO Download & Burn

First we will need the installation ISO image file so we can create a DVD.
Download it for free from kubuntu.org/getkubuntu
(Choose 64bit or 32bit depending on your computer architecture)

Once downloaded, it is recommended to burn the image file to a DVD and not a USB. Various programs that promise a good USB result have issues -- but there are two good ones I can recommend:
If you are on Linux already, use: UNetbootin
If you are on Windows, use: LinuxLive USB Creator

It is now time to burn the ISO.
When your medium (DVD or USB) is ready, you may need to enter your BIOS setup Boot Options and make sure that you can boot from DVD or USB if needed.

Installation

Note: If you use a Wi-FI there will be an extra step in the process below. Take the time to enter your Wi-Fi information at that point.


Step 1.
Start the computer that you have planned to install the system on, with the installation DVD or USB on it.
When your computer starts you will first see the boot screen, followed by the desktop loading screen.






Step 2.
At this point you will see the Live Desktop with an icon Install Kubuntu on the upper left corner.
Double click on it.




Step 3.
A window opens which lets you select the language you prefer for the installation process.
After you have selected the language, click the Continue button.




Step 4.
In this next step, click the checkbox Install third-party software for graphics and Wi-Fi hardware, Flash, MP3 and other media.
You can leave the Download updates while installing Kubuntu unchecked so that we can install the updates afterwards.
This will make sure we install the system faster. Click the Continue button.




Step 5.
Now we will choose how we want the hard drive to be formated.
Select the option: Guided - use entire disk and setup LVM
Warning: This will format the whole hard drive on the computer and create it's own partitions needed.
Any data on this drive will be wiped out.
Click the Install Now button.




Step 6.
A window opens with information about the changes that will occur to the disk.
Confirm by clicking on the Continue button.




Step 7.
At this point the system has started copying files in the background. While it is doing this, we will be asked some questions.
Select your Time Zone / location by clicking on the world map -- if it is not correctly guessed already.
You can also use the drop down menus Region and Time Zone to select your location.
Click the Continue button.




Step 8.
Next is the Keyboard Layout setup.
Choose the Layout and Variant if needed and click on the Continue button.
Note that you can also change the system language after installation.




Step 9.
Last, your computer user information.
Type in Your Name, Username, Password (twice), and set a name for your computer.
When it all looks good, click on the Continue button.




Step 10.
The system will now continue the installation without any more questions.
There will be only two more things to do before the very end.
Just sit back and watch for a little bit.




Step 11.
When this window appears, the installation has finished and you are asked to restart the computer.
You should not take the DVD or USB out yet.
Click on the Restart Now button.




Step 12.
When you see this screen, it is now the time to remove the DVD or USB stick from the computer.
When removed, hit ENTER on your keyboard.
The system will reboot.




Step 13.
This was the first system boot.
When you see this screen (the login screen) you can login to your new system.






Step 14.
After you login and wait a few seconds, if you look at the lower right corner there will be a notification about software updates.
These are the ones we didn't install during the installation process.
Click on it, and then on the Update button.






Step 15.
The Updates window opens with the list of updates to be downloaded and installed.
Click on the Update button of this window.




Step 16.
You will be asked for your password.
Linux will always ask for your password when you want to make changes to the system such as when installing updates or other software.




At this point everything is up to date.
If you see a notification on the lower right corner for a reboot, you should reboot the system as well.




Your new Linux system is ready. Be creative.

In this tutorial we are going to see how to change the limits set by PHP, for POST and File Uploads. It is always important to understand and have control of your PHP configuration. By default, PHP has these values set very low, but in most cases this would cause us problems. If for example we have a website that runs a CMS or App and we need to upload plugins and other kinds of files, such as images, from the browser, we need to raise the default values.

Default Values

post_max_size = 8M
upload_max_filesize = 2M

The post_max_size and upload_max_filesize are directives and are in a way related. The upload_max_filesize is the max limit of a single file upload, while the post_max_size is the max limit of the entire body of a request, that may include multiple files. This means that if we want to upload an image that is 5 megabytes, we need both the upload_max_filesize and post_max_size to have a higher value than 5M. In a similar way, if we have a plugin ready to install to our CMS and it's size is 8 megabytes, then we need these values to be set higher than the filezise of the archive we need to install/upload.

Lets see what the PHP manual says about these directives.

post_max_size

Sets max size of post data allowed. This setting also affects file upload. To upload large files, this value must be larger than upload_max_filesize. Generally speaking, memory_limit should be larger than post_max_size. PHP allows shortcuts for byte values, including K (kilo), M (mega) and G (giga). PHP will do the conversions automatically if you use any of these.

upload_max_filesize

The maximum size of an uploaded file.

Access and edit the php.ini

The recommended way is to set the desired values for these directives in your php.ini if your host gives you access to it. Hosting services often provide a custom php.ini file in your account's home directory, or through a control panel. Note that some hosts don't allow you to change some of these values. If you are not sure or you don't know where to look, contact your host and ask.

The way to set them in the php.ini is as in this example:

post_max_size = 20M
upload_max_filesize = 20M

Notice the capital M that follows the two digits without a space in between (M stands for megabytes). You can have K (kilo), M (mega) and G (giga). Remember to look for these directives in the php.ini file first and not set them twice at random places.

No access to php.ini

In the case that your server runs PHP as an Apache module and you have permission by your host's configuration to change these values using .htaccess, then you can set them in an .htaccess file (not recommended) as follows:

php_value post_max_size 20M
php_value upload_max_filesize 20M

Note that the php_value Apache directive is provided by the mod_php module. If you don't run PHP as an Apache module (i.e., it runs as FastCGI) then php_value directive will not be defined. If you get a 500 Internal Server Error, then you do not have permission to set these values using an .htaccess file.

Server Configuration Reload

If you are on a shared hosting environment, you may need to wait for a little while before your changes get applied. If you run your own server, you may need to reload Apache depending on where you made the change. On Debian based systems such as Debian and Ubuntu, run this in the shell:

service apache2 reload

You do not need a complete service restart.

Note: You do not need to raise these values too high except if you plan to upload movies via a php script. Do not confuse an FTP upload with this -- it is a different server that is going to answer the request, a WEB server in this case, not an FTP server.

In this tutorial we are going to follow a classic way in order to find out if the jQuery library is properly loaded on your site or page. We will also check to see if it is loaded more than once, which would be very wrong -- the jQuery library must be loaded just once.

Let's dive directly into the Source Code of a page, the homepage say, using a web browser. I will use Firefox for this. Right-click on the page and select: View Page Source. A window opens. Use CTRL+F to search in this window, type: jquery in the search box and click on: Highlight All which is right next to it. Check all the highlighted results, looking for URLs pointing to a JS file similar to jquery.js or jquery.min.js or say, jquery-1.11.2.min.js (the filename may contain a version).

Such a URL would look like this:
External URL example:

http://code.jquery.com/jquery-1.11.2.min.js

Local URL Example 1:

/media/jui/js/jquery.min.js

Local URL Example 2:

/js/jquery.min.js

URLs to jQuery or other scripts are in between script tags, usually in the head section of the page, in the source code, like this:

< script src="http://code.jquery.com/jquery-1.11.2.min.js" type="text/javascript">< /script>

or

< script src="/js/jquery.min.js" type="text/javascript">< /script>

Go on and select the URL only, copy it, open a new browser tab and paste it. If the URL is local, prefix it with your site's domain (add your site's domain in the front). Example:

http://example.com/js/jquery.min.js

Either External or Local/Internal, the URL is ready to be tested in the new tab. Hit enter in the address bar of your browser. If the URL is valid it will load the file on the browser, like this one: [ Link ]

On the very top of the file you will see some information similar to this:

jQuery v1.11.2 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license

In this particular example, this is jQuery library version 1.11.2. If the file does not load at all, then there is a issue with the URL itself, just try again. If it loads, then that jQuery library version is loaded on your site (or just on that particular page).

If you run a CMS such as Joomla, there may be extensions that force-load the jQuery library although it may already be loaded, either by the CMS itself, or another extension. This is a very wrong thing to happen, so all you have to do is keep searching for similar URLs on the same page. If you have noticed additional or wrongly loaded (or other) jQuery libraries by other extensions you may check for options on these extensions (such as 'Load jQuery: Yes/No'). An extension that loads a library such as jQuery should have such options. If you cannot find any, request from your developers to give you options. Wrongly or double loaded jQuery library or scripts can affect pageload dramatically and cause javascript functionality conflicts.

You can repeat a search using: .js as keyword to find all scripts loaded.
Finally, test if jQuery works, simply by adding the following javascript code in your html:

< script type="text/javascript">
window.onload = function()
{
    if (window.jQuery)
    {
        alert('jQuery is loaded');
    }
    else
    {
        alert('jQuery is not loaded');
    }
}
< /script>

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.

Since Joomla 3.0.0

Chosen custom modified, used in Joomla 4.0.0-Alpha5 to Joomla 4.2.x
Chosen 1.6.2 (custom modified) used in Joomla 3.7.0-Alpha1 to Joomla 4.0.0-Alpha4
Chosen 0.14.0 (custom modified) used in Joomla 3.2.3 to 3.6.5
Chosen 0.9.8 (custom modified) used in Joomla 3.0.0 to 3.2.2

This is a frequently updated list of Chosen used in Joomla. Chosen is not loaded by default in Joomla 5 and 4, it has not been completely removed from the Joomla 4 package, but has been classified as Legacy. This means that 3rd party extension developers can still load it if required, but it will still be this old version you see here. The Chosen versions used in Joomla 3 are not official, they are custom modified. Joomla since version 3.0.0 to 3.2.2 was using a custom modified version of Chosen 0.9.8 and since Joomla 3.2.3 to 3.6.5, it was using a custom modified version of Chosen 0.14.0 (the latest of the Chosen 0.x.x Series). When Joomla 3.7.0-Alpha1 was released, it contained Chosen 1.6.2, but it was once again custom modified.

All Chosen versions used by the Joomla 3 core, are custom modified versions of the Chosen framework.

We can also see this as a comment. This one is from the most recent file:

/media/jui/js/chosen.jquery.js​

Modified for Joomla! UI:
- revert the check for instance type of data-chosen, to allow to disable Chosen for field with data-chosen="true", @see https://github.com/joomla/joomla-cms/pull/12877
- rename the css and javascript classes and functions to revert back to using chzn and liszt
- fix zero width, based on https://github.com/harvesthq/chosen/pull/1439
- allow to add a custom value on fly, based on https://github.com/harvesthq/chosen/pull/749​

This of course, either by using the Eorisis Elements extension, or without, will result in rendering errors if you want to use the official chosen libraries, say by loading them from a CDN source -- you can't. In case you do that, just to try and see how things break, or by accident, disable the extension temporarily for the menus to come back, clear your browser's cache, then navigate to the extension and remove the official Chosen.

Chosen has been completely removed from the Eorisis Elements extension on January 20, 2017 for all the above reasons.

Chosen officially released v1.0 on 30/07/2013 and stated:

All CSS class names have been renamed from a chzn- root to a chosen- root : All custom Chosen events starting with liszt are now prefaced with a chosen: [ Link ].

Note that Chosen versions older than 1.4.0 had an XSS vulnerability in the Chosen code itself as announced here: [ Link 1 ] [ Link 2 ]. Chosen versions 0.9.7 or older would not be included in the extension because the official Chosen files come with version information mistakes.

In general, although Chosen is a nice package that transforms the default browser "select" dropdown menus into silky nice ones, the Joomla team should follow the official releases and stay up-to-date without custom modifications. If any change needs to be done in an area, that area is the Joomla core. This is why it is not a great idea to always include external libraries such as this, especially if you are not willing to follow. Otherwise it would better be out of the Joomla core, because it locks the site admin/webmaster to use it, most of the times with old versions.

For those that use the latest version of modern browsers such as Firefox, the default browser's select drop down menus are very nicely following your operating system's theme (unless you are using some pirate Windows XP), so any extreme design of the select menus on a site will most possibly from now on be considered Kitsch, once modern web design focuses on simplicity. In a way, unless you prefer oldschool styles and design.

You can add any version of Chosen or even remove it from being loaded by the Joomla core using Eorisis Elements available in both Free/Pro editions.

Since Joomla 3.0.0

Bootstrap 5.3.3 used in Joomla 5.2.0-Beta3 to 6.0.0-Alpha1-Dev
Bootstrap 5.3.2 used in Joomla 4.4.0-Beta3 to 5.2.0-Beta2
Bootstrap 5.3.1 used in Joomla 4.4.0-Alpha4 to 5.0.0-Beta2
Bootstrap 5.3.0 used in Joomla 4.4.0-Alpha3-dev to 5.0.0-Alpha3-Dev
Bootstrap 5.2.3 used in Joomla 4.3.0-Alpha3 to 4.3.0 / 4.4.0-Alpha1 / 5.0.0-Alpha3-dev
Bootstrap 5.1.3 used in Joomla 4.0.6-RC to 4.3.0-Alpha2
Bootstrap 5.1.2 used in Joomla 4.0.4-RC to 4.0.5
Bootstrap 5.0.2 used in Joomla 4.0.0-RC3 to 4.1.0-Alpha1
Bootstrap 5.0.1 used in Joomla 4.0.0-Beta8-dev to 4.0.0-RC2
Bootstrap 5.0.0 used in Joomla 4.0.0-Beta8-dev
Bootstrap 5.0.0-beta3 used in Joomla 4.0.0-Beta8-dev
Bootstrap 5.0.0-beta2 used in Joomla 4.0.0-Beta8-dev
Bootstrap 5.0.0-beta1 used in Joomla 4.0.0-Beta7
Bootstrap 4.5.3 used in Joomla 4.0.0-Beta7-dev
Bootstrap 4.5.2 used in Joomla 4.0.0-Beta4 to 4.0.0-Beta5
Bootstrap 4.5.0 used in Joomla 4.0.0-Beta1 to 4.0.0-Beta3
Bootstrap 4.4.1 used in 4.0.0-Beta1-dev
Bootstrap 4.3.1 used in Joomla 4.0.0-Alpha7 to 4.0.0-Beta1-dev
Bootstrap 4.1.3 used in Joomla 4.0.0-Alpha5 to 4.0.0-Alpha7-Dev
Bootstrap 4.1.1 used in Joomla 4.0.0-Alpha3 to 4.0.0-Alpha4
Bootstrap 4.0.0-beta.2 used in Joomla 4.0.0-Alpha1 to 4.0.0-Alpha2
Bootstrap 2.3.2 (custom modified) used in Joomla 3.1.4 to 3.10.x
Bootstrap 2.1.0 (custom modified) used in Joomla 3.0.0 to 3.1.1

This is a frequently updated list of Bootstrap used in Joomla. The Bootstrap versions used in Joomla 3 are not official, they are custom modified. Custom modified versions of Bootstrap 2.1.0 are used in Joomla 3.0.0 to 3.1.1, while custom modified versions of Bootstrap 2.3.2 (the latest of the 2.x series) are used from Joomla 3.1.4 to 3.10.x. In a few words, all Bootstrap versions used by the Joomla 3 core, are custom modified versions of the Bootstrap framework 2.x series.

We can also see this as a comment on each file:

/media/jui/js/bootstrap.js
/media/jui/js/bootstrap.min.js​

* Custom version for Joomla!

Using modified versions of the library is not a good practice and this has changed in Joomla 4 and 5. In Joomla 3 the site admins/webmasters were locked to only use that custom modified bootstrap version that comes with the Joomla core. Since javascript functions have been changed inside the bootstrap.js and bootstrap.min.js files, loading any official Bootstrap version other than the one of the core, causes serious functionality problems in the Joomla administrator area when the default template is used. The official Bootstrap 2.3.2 can be used in the Site (Front End) area without fear, although it is a very old version released in 2012. Any Bootstrap 5.x, 4.x or 3.x series version would cause javascript functionality conflicts if used in Joomla 3.

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.

Since Joomla 3.0.0

jQuery UI 1.9.2 used in Joomla 3.2.0 to 4.0.0-Beta1-dev
jQuery UI 1.8.23 used in Joomla 3.0.0 to 3.1.6

This is a list of the jQuery UI used in Joomla 3. jQuery UI was removed in Joomla 4.0.0-beta1. The jQuery UI versions used in Joomla 3 are official (untouched) and this is how things should be, but are archaic, as jQuery UI 1.9.2 was released in 2013-07-14.

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.

Since Joomla 3.2.0

jQuery Migrate 3.4.1 used in Joomla 4.3.0-Beta4 to 6.0.x
jQuery Migrate 3.4.0 used in Joomla 4.3.0-Alpha1 to 4.3.0-Beta3
jQuery Migrate 3.3.2 used in Joomla 4.0.0-Beta7 to 4.2.x
jQuery Migrate 3.3.1 used in Joomla 4.0.0-Beta4 to 4.0.0-Beta7-dev
jQuery Migrate 3.3.0 used in Joomla 4.0.0-Beta1 to 4.0.0-Beta3
jQuery Migrate 3.1.0 used in Joomla 4.0.0-Beta1-dev
jQuery Migrate 3.0.1 used in Joomla 4.0.0-Alpha5 to 4.0.0-Alpha10
jQuery Migrate 1.4.1 used in Joomla 3.6.0-Beta1 to 4.0.0-Alpha4
jQuery Migrate 1.2.1 used in Joomla 3.2.0 to 3.6.0-Alpha

This is a frequently updated list of the jQuery Migrate used in Joomla. The Migrate version used in Joomla is official (untouched) and this is how it should be. Joomla 3.0.0 to 3.1.6 does not include Migrate in the core because it uses jQuery libraries up to version 1.8.3.

Migrate is only required for jQuery 1.9.0 or higher to restore deprecated and removed functionality.

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.

Since Joomla 3.0.0

jQuery 3.7.1 used in Joomla 4.4.0-Beta1 to 6.0.x
jQuery 3.7.0 used in Joomla 4.4.0-Alpha1 to 5.0.0-Beta1-Dev
jQuery 3.6.4 used in Joomla 4.4.0-Dev to 5.0.0-Dev
jQuery 3.6.3 used in Joomla 4.3.0-Alpha3 to 4.3.0
jQuery 3.6.1 used in Joomla 4.3.0-Alpha1 to 4.3.0-Alpha2
jQuery 3.6.0 used in Joomla 4.0.0-Beta8-Dev
jQuery 3.5.1 used in Joomla 4.0.0-Beta1 to 4.0.0-Beta8-Dev
jQuery 3.4.1 used in Joomla 4.0.0-Alpha9 to 4.0.0-Beta1-Dev
jQuery 3.3.1 used in Joomla 4.0.0-Alpha3 to 4.0.0-Alpha8
jQuery 3.2.1 used in Joomla 4.0.0-Alpha1 to 4.0.0-Alpha2
jQuery 1.12.4 used in Joomla 3.6.0-Beta1 to 3.10.x
jQuery 1.11.3 used in Joomla 3.4.4-RC2 to 3.6.0-Alpha
jQuery 1.11.2 used in Joomla 3.4.0-Beta1 to 3.4.4-RC
jQuery 1.11.1 used in Joomla 3.3.1 to 3.4.0-Alpha
jQuery 1.11.0 used in Joomla 3.2.3 to 3.3.0
jQuery 1.10.2 used in Joomla 3.2.0 to 3.2.2
jQuery 1.8.3 used in Joomla 3.1.0 to 3.1.6
jQuery 1.8.1 used in Joomla 3.0.0 to 3.0.4

This is a frequently updated list of the jQuery libraries used in Joomla. The jQuery versions used in Joomla are official (untouched).

Joomla 5 and 4 as well as jQuery 3 do not support IE versions 6 to 8. These browsers are too old to be used. If you need IE6-8 support, you can continue to use the latest 1.12 release of jQuery.

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.

Note: This article is outdated.
The Joomla extension mentioned in this article has improved: Eorisis Elements available in both Free/Pro editions.

---

In this tutorial I am going to show you how you can easily add your jQuery scripts (JS files) and/or stylesheets (CSS files) to your Joomla site, so that they get loaded either on the Front End and/or the Back End, without having to hack Joomla core or other extension code. The files can either be Internal (loaded from the local system, your own site/server), or External (loaded from an external source/site, i.e., a CDN).

To do this properly we need the eorisis jQuery plugin installed and enabled. We will make use of the Add Files tab of the plugin.

Choose one or more of the following, depending on what you need to do.

Add a custom jQuery script: Load it to your site from the Local/Internal system:

1. Create a file, for example: my-script.js (the file extension must be 'js').
2. Place your jQuery code inside this file.
3. Create a folder inside the Joomla's /media/ directory (Recommended), for example /media/my-folder/
4. Upload your my-script.js to that directory. The final path will look like this: /media/my-folder/my-script.js
5. Go to your Extensions -> Plugins -> System - eorisis: jQuery plugin in the Joomla Administrator and open the Add Files tab.
6. Copy and paste the path to your file /media/my-folder/my-script.js in the JavaScript > URLs field (you can omit the leading forward slash).
7. Set JavaScript to Enabled.
8. Use the Area option to load the script to the Front End (Site), Back End (Administrator), or to both of them.
9. Save the plugin, clear your Joomla and browser's cache and reload your site.

Add a jQuery script: Load it to your site from an External source:

1. Go to your Extensions -> Plugins -> System - eorisis: jQuery plugin in the Joomla Administrator and open the Add Files tab.
2. Copy and paste the URL that points to the JS file, in the JavaScript > URLs field (Scheme Relative URL - Read Notes below).
Example URL: //cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js
3. Set JavaScript to Enabled.
4. Use the Area option to load the script to the Front End (Site), Back End (Administrator), or to both of them.
5. Save the plugin, clear your Joomla and browser's cache and reload your site.

Add a custom Stylesheet (CSS): Load it to your site from the Local/Internal system:

1. Create a file, for example: my-styles.css (the file extension must be 'css').
2. Place your CSS code inside this file.
3. Create a folder inside the Joomla's /media/ directory (Recommended), for example /media/my-folder/
4. Upload your my-styles.css to that directory. The final path will look like this: /media/my-folder/my-styles.css
5. Go to your Extensions -> Plugins -> System - eorisis: jQuery plugin in the Joomla Administrator and open the Add Files tab.
6. Copy and paste the path to your file /media/my-folder/my-styles.css in the StyleSheet > URLs field (you can omit the leading forward slash).
7. Set StyleSheet to Enabled.
8. Use the Area option to load the script to the Front End (Site), Back End (Administrator), or to both of them.
9. Save the plugin, clear your Joomla and browser's cache and reload your site.

Add a Stylesheet (CSS): Load it to your site from an External source:

1. Go to your Extensions -> Plugins -> System - eorisis: jQuery plugin in the Joomla Administrator and open the Add Files tab.
2. Copy and paste the URL that points to the CSS file, in the StyleSheet > URLs field (Scheme Relative URL - Read Notes below).
Example URL: //cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap-theme.min.css
3. Set StyleSheet to Enabled.
4. Use the Area option to load the script to the Front End (Site), Back End (Administrator), or to both of them.
5. Save the plugin, clear your Joomla and browser's cache and reload your site.

Warnings:

- Do not upload files or create any custom folder inside the /media/eorisis-jquery/ directory, as they will be wiped out after an update of the eorisis jQuery plugin.
- Custom scripts should be used from sources or developers that you trust. Do not load anything you find here and there to your website.

Notes:

- You can load any number of JS or CSS files, Internal or External, one per line.
- For Local/Internal files, if you need to make changes to the code in any of the files you added in the Add Files tab does not mean you have to change your settings in the eorisis jQuery plugin, unless you completely change a filename, folder, or any part of the path. Organise a stable directory/file structure that you will not change often.
- If you load files from an external source, make sure that the source is a CDN. Never hotlink files from websites that you are not authorized to do so.
- Scheme Relative URLs omit the http: or https: part and begin directly with the the double forward slash //. Although this is the best practice when using External URLs from a CDN to avoid SSL conflicts, always make sure that the CDN does have SSL enabled by testing the URL with https directly from your browser. Trying a Scheme Relative URL from your browser will fail.
- Joomla's /media/ directory is the best area to create your custom folder. Of course you can create a folder anywhere else, but it cannot be outside the Joomla's root (this is the directory where your Joomla is installed).
- The jQuery library must be loaded to the same Area that you chose to load your custom media using the Add Files tab.
- Always inspect the source code of your pages to make sure everything is correctly and nicely added.

---

Recommended Joomla Extension: Eorisis Elements available in both Free/Pro editions.