Include jQuery across pages

Include jQuery across HubSpot-hosted pages when needed for modules or custom scripts that rely on it. While many newer themes and modules no longer depend on jQuery, older assets may need it to work correctly. Use the jQuery settings to manage compatibility, choose a version, and decide where the library loads on your pages.

Before you get started

Before you include jQuery across HubSpot-hosted pages, make sure to fully understand what steps should be taken ahead of time, as well as the limitations of the feature and potential consequences of using it. 

Understand limitations & considerations

• Settings applied to a specific subdomain override the default settings for all domains.
• Some modules, such as the image gallery module, require jQuery. Turning off the Include jQuery setting won't remove jQuery if it is required by a module.
• Changing where jQuery loads (head or footer) may require updates to scripts that depend on it.

Include jQuery

1. In your HubSpot account, click the settings settings icon in the top navigation bar.
2. In the left sidebar menu, navigate to Content > Pages.
3. At the top of the page, click the Choose a domain to edit its settings dropdown menu to select which domains you want to edit.
   • To edit this setting for all domains, select Default setting for all domains.
   • To edit edit this setting for a specific subdomain, select a domain from the dropdown menu. 
4. In the jQuery section on the Templates tab, select the Include jQuery checkbox to load jQuery across your HubSpot pages.

5. To change the version of jQuery, click the jQuery version dropdown menu and select a version:
   • 1.7.x: select this version if you've already built your logic using dependencies from an older version of jQuery.
   • 1.11.x: if you select this version, it's recommended to select the Include jQuery migrate script checkbox as well. This will add a script to your templates to improve compatibility with older browsers.
6. By default, the jQuery library will be loaded in the head HTML of pages. To include jQuery in the footer of pages, select the Load HubSpot's included jQuery library from your footer checkbox.
   • If you include jQuery in the footer, it's recommended to also move all jQuery dependencies to the footer.
   • To test how your pages load with jQuery in the footer, append
     ?hsMoveJQuerytoFooter=True to the end of your page URL.
7. When finished, click Save on the bottom left.

Please note: it's recommended to consult with your web developer before moving jQuery to the footer of your pages. If you have additional questions, connect with HubSpot designers on the Community.