How to relocate JavaScript files from standard_header_includes to footer section in HubSpot

I’m fairly new to working with HubSpot and I’m trying to boost my website’s page speed performance scores. The main problem I’m facing is that JavaScript files are causing render-blocking issues because they’re all loading in the header section.

I want to move these script files down to the footer area to improve loading times, but I can’t figure out how to do this. All the CSS and JS files appear to be coming from the {{ standard_header_includes }} template variable, but I’m not sure where this code is defined or how I can modify it to push scripts to the bottom of the page.

Has anyone dealt with this before? I’d really appreciate any guidance on how to relocate these files to the footer in HubSpot.

The {{ standard_header_includes }} variable is managed by HubSpot’s system and can’t be directly edited, which is frustrating when trying to optimize performance. What worked for me was using the defer attribute on custom JavaScript files I added through the template editor. You can also leverage HubSpot’s built-in JavaScript bundling feature in the Design Manager settings to reduce the number of HTTP requests. Another approach is to identify which scripts are actually critical for above-the-fold content and keep only those in the header while moving non-essential scripts to custom modules placed before the closing body tag. This method helped me achieve better Core Web Vitals scores without breaking site functionality.

I faced a similar challenge while optimizing a client’s HubSpot site a few months back. Unfortunately, you can’t directly modify the {{ standard_header_includes }} variable, but there’s a workaround. I created custom modules for the JavaScript files that needed to be moved and used HubSpot’s exclude functionality to remove those scripts from the header section. You can find this exclusion option in the Design Manager under template settings. Just make sure to identify the scripts that contribute to render-blocking issues, as moving essential scripts could break functionality. After implementing this, I noticed a solid improvement in the site’s PageSpeed metrics.

When I encountered this same issue during a recent HubSpot optimization project, I discovered that HubSpot’s native performance tools actually provide some control over script loading behavior. In your HubSpot account settings under Website Performance, you can enable JavaScript compression and bundling which helps reduce render blocking to some extent. Additionally, I found success by creating a custom footer template that includes only the essential JavaScript files using HubL tags, then modifying individual page templates to reference this custom footer instead of relying entirely on the standard includes. The key is testing thoroughly after implementation since some HubSpot tracking scripts need to remain in the header to function properly. This approach gave me measurable improvements in First Contentful Paint scores.

yeah i had this headache too when optimizing my hubspot site last year. what helped was going into the page template editor and adding a custom html module right before the closing tag. then i manually added the non-critical js files there using async loading. its not perfect but definitely improved my lighthouse scores without breaking anything important.

I ran into this exact problem about six months ago while working on a client’s site. The trick that finally worked for me was using HubSpot’s template inheritance feature combined with conditional loading. Instead of fighting with the standard_header_includes, I created a base template where I added conditional HubL code to detect which scripts were actually needed on each page type. Then I used the require_js function to load only critical scripts in the header and pushed everything else to a custom footer section. The conditional logic prevented unnecessary scripts from loading on pages where they weren’t needed, which significantly reduced the render blocking issues. Make sure to test your contact forms and tracking pixels after making changes since some HubSpot functionality depends on specific load order.