JS External File snippets load JavaScript libraries or scripts from a remote URL, with support for defer and async loading attributes. This type is best when you need to include a third-party library from a CDN — such as jQuery, a jQuery plugin, a charting library, a heatmap tool, or any hosted script — without embedding the code directly into your snippet.
To learn how to load external JavaScript files in Joomla, follow the steps below:
- Log into your Joomla administrator
- Go to Components → Tassos Code Snippets
- Click New
- Enter a descriptive Title (e.g. "Load jQuery from CDN")
- Select JavaScript External File as the Code Type.
- Choose one of the following insertion locations
- Site Header
- Site Footer
- Admin Header
- Admin Footer
- Enter the URL(s) of the JavaScript files you want to load, one per line. Do not write any JavaScript or HTML in the editor — only plain URLs. The extension will create a <script> tag for each URL and inject it at the chosen location.
- In the Script Loading option select how the scripts should be loaded.
- Defer delays execution until the page is parsed.
- Async loads the script asynchronously.
- Open the Conditional Logic tab to restrict which pages or users the snippet runs on. Leave it empty to run it site-wide. Learn more in Using Snippet Logic.
- Set Status to Published and click Save & Close.
- Check URL: Verify the URL is correct and accessible
- Check HTTPS: Ensure using HTTPS, not HTTP
- Check console: Look for errors in browser console (F12)
- CORS issues: Some scripts require
crossorigin attribute
- CDN availability: Verify CDN is operational
- Load order: Ensure dependencies load first (check priorities)
- Timing: Script may need
defer or different location
- Conflicts: Check for JavaScript conflicts in console
- Initialization: Some libraries require initialization code
- Defer loading: Use
defer or async attributes
- Location: Move scripts to Footer
- Minimize requests: Reduce number of external files
- Use faster CDN: Switch to more reliable CDN
Rated: 