Scripts & Styles

Elementor Core Intermediate

Just like WordPress, Elementor has special hooks to register custom scripts and styles. It's very important to use the correct hook in order to improve site performance. Using Elementor recommendations and best practices helps Elementor enqueue files dynamically only when they are used, reducing performance impact.

Static vs. Dynamic Loading

Some scripts should always be loaded, others only when used. For example, editor scripts should always be loaded, while widget scripts should only be loaded when they are being used. Elementor allows developers the freedom of choosing either method.

Each script and stylesheet increases the page size. This is why it is best practice to register assets and let Elementor decide whether or not to load them. Elementor checks to see if the page uses an element requiring your script, and only then it is loaded.

Frontend Scripts & Styles

Learn more about registering new scripts and styles to frontend pages:

• Frontend Scripts
• Frontend Styles

Editor Scripts & Styles

Learn more about registering new scripts and styles to the Elementor Editor:

• Editor Scripts
• Editor Styles

Preview Scripts & Styles

Learn more about registering new scripts and styles to Elementor preview:

• Preview Scripts
• Preview Styles

Widget Scripts & Styles

Learn more about registering custom scripts and styles to Elementor widgets:

• Widget Scripts
• Widget Styles

Controls Scripts & Styles

Learn more about registering custom scripts and styles to Elementor controls:

• Control Scripts
• Control Styles