HubSpot forms integration

Introduction

Looking to personalize and test HubSpot forms without touching code?

This template connects your HubSpot forms to Croct so you can decide which form each visitor sees. Instead of hardcoding the form ID in your page, you store it in a slot and render whichever form ID it returns.

From there, an AB test or a personalized experience can change the form ID per user, and your page renders the matching form automatically.

Using Croct, you get:

• AB testing support with real-time audience evaluation
• Form personalization based on location, behavior, or custom rules
• Built-in analytics and Bayesian analysis for every variant and experience
• Support for both legacy and new HubSpot forms

What's included

This template creates a hubspot-form component with a single formId text field, a hubspot-form slot that stores the form to render, and adds the slot to your project.

Usage

Run the following command in your project to apply this template:

npx croct@latest use croct://integration/hubspot

Once installed, fetch the slot and embed the returned form ID. The HubSpot forms tutorial walks through embedding the form and tracking submissions.