What are External Scripts?
External scripts are code loaded from URLs (CDNs, analytics providers, etc.) rather than code you write. Common examples:- Analytics: Google Analytics, Plausible, Fathom
- Tracking: Facebook Pixel, LinkedIn Insight, Google Ads
- Libraries: GSAP, Swiper, Lottie, jQuery
- Widgets: Intercom, Crisp, Calendly
- Fonts: Google Fonts, Adobe Fonts
Adding an External Script
1
Go to External Scripts
Open your site and click the External tab.
2
Click Add External Script
Click the Add button.
3
Enter the URL
Paste the script or stylesheet URL:
4
Configure options
Set the type, position, and loading behavior.
5
Save
Click Save to add the external script.
Configuration Options
Type
- Script: JavaScript files (
.js) - Stylesheet: CSS files (
.css)
Category
Organize your external scripts:- Library: Code libraries (GSAP, Swiper, etc.)
- Tracking: Analytics and pixels
Position
Where the script loads in the HTML:- Head: Loads in
<head>, before page content - Body End: Loads at end of
<body>, after content
Loading Attributes
Control how the script loads:| Attribute | Behavior |
|---|---|
| None | Blocks rendering until loaded |
| Defer | Loads in background, executes after HTML parsed |
| Async | Loads in background, executes immediately when ready |
When to use Defer
When to use Defer
Use for most scripts. They load without blocking and execute in order.
When to use Async
When to use Async
Use for independent scripts that don’t depend on other code (like analytics).
When to use Neither
When to use Neither
Rare. Only when a script must execute immediately and block rendering.
Scope
- Global: Loads on every page
- Page-specific: Loads only on selected pages
Component Selector
Only load when a specific element exists:Common External Scripts
Google Analytics 4
GSAP
Swiper
Lottie
Font Awesome
Managing External Scripts
Enable / Disable
Toggle external scripts on or off without removing them. Useful for:- Temporarily disabling tracking during development
- A/B testing different libraries
- Debugging conflicts
Ordering
External scripts load in the order shown. Drag to reorder if you need a library to load before another.Editing
Click on any external script to modify its URL or settings.Best Practices
Use CDNs for libraries
Use CDNs for libraries
CDNs like cdnjs, jsDelivr, and unpkg are fast and reliable. They’re often already cached in visitors’ browsers.
Pin versions
Pin versions
Include version numbers in URLs to prevent unexpected updates:
Use defer for most scripts
Use defer for most scripts
Defer is the safest option—it doesn’t block rendering and maintains execution order.
Page-target tracking pixels
Page-target tracking pixels
If a tracking pixel is only for conversions, load it only on the thank-you page.
Test after adding
Test after adding
New external scripts can conflict with existing code. Always test your site after adding one.
External Scripts vs Dependencies
| Feature | External Scripts | Script Dependencies |
|---|---|---|
| Managed in | External tab | Individual script settings |
| Scope | Site-wide or per-page | Per-script |
| Best for | Analytics, global libraries | Script-specific libraries |