Load External CSS and JavaScript

Need to use a third-party library or custom styling inside your popup? In this guide, you'll learn how to load external CSS and JavaScript files directly within EngageBox or using the Code Snippets extension.

Load External CSS and JavaScript with EngageBox

Load external CSS and JavaScript directly from your popup settings. This option is available in EngageBox Pro.

1. Edit your EngageBox popup.
2. Go to PHP Scripts.
3. Open the After Render section.
4. Add your external CSS:

   $doc→getWebAssetManager()
       →registerStyle('style_name', 'https://example.com/style.css')
       →useStyle('style_name');

5. Add your external JavaScript:

   $doc→getWebAssetManager()
       →registerScript('library_name', 'https://example.com/script.js')
       →useScript('library_name');

6. Save the popup and test it on the frontend.

Load External CSS and JavaScript with Code Snippets

Code Snippets is a versatile free Joomla extension that lets you load external CSS and JavaScript files effortlessly.

• Need to load a JavaScript file? Follow the JavaScript External File guide.
• Need to load a CSS file? Follow the CSS External File guide.

Optional Notes section

• Use unique asset names to avoid conflicts and ensure all assets load properly on your site.
• Prefer trusted/CDN sources only.