Add a Javascript file to HubSpot

Last updated: August 3, 2018

Applies to:

Marketing Hub: Basic, Pro, Enterprise

In your design manager, you can host and edit JavaScript files. This article walks through adding a JavaScript file and linking it to a site, template, or page.

In your HubSpot Marketing Hub Basic, Professional, or Enterprise account, navigate to Marketing > Files and Templates > Design Tools.

Create a new file by clicking Actions > New file in the left sidebar menu (you may need to click the folder icon folder to expand the menu) or click Create a new file in the upper right-hand corner (this button appears if you don't have any tabs open in your design manager). 

In the dialog box, click JavaScript

In the next dialog box, enter a name for your JavaScript file and click Create.

Type or paste your JavaScript into the code editor. Click Publish changes to update your script and make your changes live.

Once you have authored your JavaScript, copy the URL to reference in your script tag to load your file. To get the URL, click Actions > Copy public URL in the left sidebar menu.

After your have the HubL tag to generate the URL of your script, you can add it to the src attribute of your script tag.

While scripts can be added to your entire site or a single page, it is recommended that scripts are added to the <head> or a HTML module in the the global footer of your template. This ensures that you only load required scripts on pages using a certain template.

To access the head tag of a template layout, open the template in your design manager. In the right sidebar menu under the Edit tab, add the following to the Additional <head> markup field:

<script type="text/javascript" src="[copied public url here]"> </script>

Alternatively, you can add the same code to a custom HTML module in your template's global footer. In your global footer, click the custom HTML footer module. In the right sidebar menu under the Edit tab, click Edit HubL source. Edit the code and then publish your changes.

To include your file on all HubSpot-hosted pages, click your photo or avatar in the upper right-hand corner of your HubSpot account and click Settings. In the left sidebar menu, click Marketing > Web pages. Under the Page Templates tab, scroll down to the Site footer HTML section and paste the generated HubL token as the value for the script tag’s source, as seen below: 

<!-- start Main.js Do Not Remove -->
<script src='insert your generated token here'></script>
<!---End Main.js-->

Click Save



Was this article helpful?

If you still need help you can get answers from the , or to contact support.