Script Injection Feature
16 min
what is this feature? this feature allows you to automatically load important scripts (like consent management, analytics, or tracking) on your website these scripts load quickly when users visit your pages and work correctly with the website's architecture why do we need this? fast loading critical scripts load immediately when users visit the page reliable scripts always work correctly regardless of how the page is loaded flexible you can add different types of scripts to different parts of the page easy management all scripts are managed through configuration instead of manual code changes how to use it? you can add scripts to your website by updating the configuration there are two places where you can add scripts adding scripts to page header scripts added here load first and are best for critical functionality { "purple" { "scripts" { "head" \[ { "src" "https //example com/important script js" } ] } } } adding scripts to page body scripts added here load after the main content { "purple" { "scripts" { "body" \[ { "src" "https //example com/analytics script js" } ] } } } common examples consent management script for cookie consent and privacy compliance { "purple" { "scripts" { "head" \[ { "src" "https //cdn consentmanager net/delivery/your script js" } ] } } } analytics tracking for website analytics and user tracking { "purple" { "scripts" { "head" \[ { "src" "https //analytics example com/tracking js" } ] } } } multiple scripts you can add multiple scripts at once { "purple" { "scripts" { "head" \[ { "src" "https //cdn consentmanager net/delivery/consent js" }, { "src" "https //analytics example com/tracking js" } ] } } } using local script files you can also load scripts from your own project files using the resource //dynamic/ prefix { "purple" { "scripts" { "head" \[ { "src" "resource //dynamic/storefront/assets/my script js" } ] } } } this allows you to load custom scripts from your project assets keep scripts with your code for version control ensure scripts are always available without depending on external urls common local script paths { "purple" { "scripts" { "head" \[ { "src" "resource //dynamic/storefront/assets/consent config js" }, { "src" "resource //dynamic/storefront/assets/tracking setup js" }, { "src" "resource //dynamic/shared/utils/common script js" } ] } } } testing your scripts how to test add a test configuration with your script load your website in a web browser open browser console (f12 → console tab) check for script loading look for success messages or errors what to look for ✅ scripts load successfully without errors ✅ scripts execute after the page loads ❌ no error messages in the console ❌ scripts don't interfere with page loading best practices when to use header vs body use header for critical scripts that need to load first (consent management, essential tracking) use body for non critical scripts (analytics, social media widgets) script loading tips add one script at a time and test it works check browser console for any error messages make sure script urls are accessible from your website test on different devices and browsers troubleshooting if scripts don't load check the url make sure the script url is correct and accessible check browser console look for error messages (f12 → console) check network verify the script file downloads (f12 → network tab) test individually add one script at a time to isolate issues common problems wrong url script file doesn't exist or url is incorrect blocked scripts browser or security settings blocking the script conflicting scripts multiple scripts interfering with each other getting help if you need help implementing this feature check that your configuration follows the examples above test with a simple script first before adding complex ones contact the development team with specific error messages from the browser console feature available since november 2025 purpose improved script loading for websites