---
title: "JavaScript External Files - Tassos Code Snippets"
description: "Link to external JavaScript libraries and files hosted on CDNs or your server."
url: "https://www.tassos.gr/docs/code-snippets/types/javascript-external-files"
date: "2026-04-29T08:33:05+00:00"
language: "en-GB"
---

[ Home ](https://www.tassos.gr/index.php?option=com_content&view=category&layout=blog&id=24&Itemid=1088) / [ Tassos Code Snippets ](https://www.tassos.gr/index.php?option=com_content&view=category&id=120) / [ Snippet Types ](https://www.tassos.gr/index.php?option=com_content&view=category&id=122)

#  JavaScript External Files

##  Link to external JavaScript libraries and files hosted on CDNs or your server.

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.

## [How to Create a JavaScript External Files Snippet](#how-to-create-a-javascript-external-files-snippet)

To learn how to load external JavaScript files in Joomla, follow the steps below:

1. Log into your Joomla administrator
2. Go to **Components → Tassos Code Snippets**
3. Click **New**
4. Enter a descriptive **Title** (e.g. "Load jQuery from CDN")
5. Select **JavaScript External File** as the Code Type.
6. Choose one of the following insertion locations
    - Site Header
    - Site Footer
    - Admin Header
    - Admin Footer
7. 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.
8. 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.
9. 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](https://www.tassos.gr/docs/tassos-code-snippets/functionality/conditional-logic).
10. Set Status to Published and click Save & Close.

## [Troubleshooting](#troubleshooting)

### [Script Not Loading](#script-not-loading)

1. Check URL: Verify the URL is correct and accessible
2. Check HTTPS: Ensure using HTTPS, not HTTP
3. Check console: Look for errors in browser console (F12)
4. CORS issues: Some scripts require `crossorigin` attribute
5. CDN availability: Verify CDN is operational

### [Script Loading But Not Working](#script-loading-but-not-working)

1. Load order: Ensure dependencies load first (check priorities)
2. Timing: Script may need `defer` or different location
3. Conflicts: Check for JavaScript conflicts in console
4. Initialization: Some libraries require initialization code

### [Slow Page Load](#slow-page-load)

1. Defer loading: Use `defer` or `async` attributes
2. Location: Move scripts to Footer
3. Minimize requests: Reduce number of external files
4. Use faster CDN: Switch to more reliable CDN

 Last updated on Mar 3rd 2026 15:03

## Schema

```json
{
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
        {
            "@type": "ListItem",
            "position": 1,
            "name": "Home",
            "item": "https://www.tassos.gr"
        },
        {
            "@type": "ListItem",
            "position": 2,
            "name": "Home",
            "item": "https://www.tassos.gr/docs"
        },
        {
            "@type": "ListItem",
            "position": 3,
            "name": "Tassos Code Snippets",
            "item": "https://www.tassos.gr/docs/code-snippets"
        },
        {
            "@type": "ListItem",
            "position": 4,
            "name": "Snippet Types",
            "item": "https://www.tassos.gr/docs/code-snippets/types"
        },
        {
            "@type": "ListItem",
            "position": 5,
            "name": "JavaScript External Files",
            "item": "https://www.tassos.gr/docs/code-snippets/types/javascript-external-files"
        }
    ]
}
```

```json
{
    "@context": "https://schema.org",
    "@type": "Article",
    "mainEntityOfPage": {
        "@type": "WebPage",
        "@id": "https://www.tassos.gr/docs/code-snippets/types/javascript-external-files"
    },
    "headline": "JavaScript External Files",
    "image": {
        "@type": "ImageObject",
        "url": "https://www.tassos.gr/"
    },
    "publisher": {
        "@type": "Organization",
        "name": "Tassos",
        "logo": {
            "@type": "ImageObject",
            "url": "https://www.tassos.gr/https://www.tassos.gr/media/brand/logo-text.png"
        }
    },
    "author": {
        "@type": "Person",
        "name": "Tassos Marinos",
        "url": "https://www.tassos.gr/docs/code-snippets/types/javascript-external-files"
    },
    "datePublished": "2026-03-02T18:19:19+02:00",
    "dateCreated": "2026-03-02T18:19:19+02:00",
    "dateModified": "2026-03-03T15:33:34+02:00"
}
```