CodeDuplex

    How to add custom codes like JS or CSS in HubSpot on specific pages

    What is custom code in HubSpot?

    Custom code is a piece of code that you can add to your HubSpot website or landing pages to extend their functionality. This code can be used to do things like adding custom scripts, or some advanced library like animations, or customize the look and feel of your website.

    How to add custom codes like JS or CSS in HubSpot on specific pages

    When should we use custom codes in HubSpot?

    There are many reasons why you might want to use custom codes in HubSpot. Here are a few of the most common reasons:

    • To add codes that you want to run on the specific page.
      For example, you might want to add a code that tracks the scroll depth of your visitors, or a code that displays a different message to visitors based on their location.

    • If you don't have access to the main theme or the design manager.
      If you are not a developer, or if you do not have access to the main theme or the design manager, you can use custom codes to make changes to your website's appearance.

    • If you are not too expert to touch the base code from the theme itself.
      Custom codes are a good option if you do not want to make changes to the base code of your website's theme. This can be helpful if you are not a developer, or if you do not want to risk breaking your website.

    How to add custom codes in HubSpot on specific pages?

    There is one way to add custom codes in HubSpot on specific pages:

    • Using the Page settings dialog box. The Page settings dialog box allows you to add custom codes to specific pages. This is a good option if you want to add different codes to different pages.

    Here are the steps on how to add custom codes in HubSpot on specific pages using the Page settings dialog box:

    1. Go to Marketing > Website > Pages.

      Go to Marketing > Website > Pages.

    2. Click on the page that you want to add the custom code.

      Click on the page that you want to add the custom code.

    3. Click on the Edit button.

      Click on the Edit button.

    4. In the page editor go to the "Settings" tab.

      In the page editor go to the "Settings" tab.

    5. Scroll down to the "Advanced options" section, and expand it. In the "Additional code snippets" section, paste your custom code in the "Head HTML" or "Footer HTML" field.

      Advanced options

    6. Hit the Update button to save and publish the changes.

    Conclusion

    Adding custom codes in HubSpot can be a great way to extend the functionality of your website or landing pages. By following the steps in this article, you can easily add custom codes to your HubSpot pages and utilize this feature of Hubspot.