Skip to main content
Default can show a booking calendar the moment a visitor submits an embedded HubSpot form on your website. The Default Pixel captures the HubSpot submission, a Default workflow picks the host, and the calendar opens on the same page. HubSpot keeps processing the submission as it normally does. For the full path from submission to booked meeting, see How Default books a meeting from a form submission.

​
HubSpot forms in Default at a glance

​
How the Pixel detects a HubSpot form

The Pixel recognizes a <form> element on the page as a HubSpot form when any of these is true:
  • Its id starts with hsForm_.
  • It has the hs-form class.
  • Its action URL points at hsforms.com or hubspot.com, or a subdomain of either. A form with no action, or one whose action only mentions HubSpot in its path or query string, does not count.
  • It contains a hidden field named hs_context.
Catalog mode uses these rules to find HubSpot forms on the page. The Pixel’s plain-HTML capture skips forms that match them, so each HubSpot submission reaches Default once. The submission itself comes from HubSpot’s events: The newer embeds give the form element a new id on every page load, such as hs_form_target_widget_<timestamp>-<guid> or <container-id>-<guid>. Default reads the GUID at the end of the id, so every render of the same HubSpot form maps to 1 form in Default. A HubSpot form embedded on several pages of the same domain is also 1 form in Default.

​
Before you start

​
Add a scheduler to a HubSpot form

1

Install the Pixel on the form's pages

Add the Pixel snippet to the <head> of every page where the HubSpot form appears, including HubSpot-hosted pages on your own domain. Load it on every page load, not from a submit handler.
2

Set the HubSpot form to show a thank-you message

In HubSpot, set what happens after a visitor submits the form to show a thank-you message, and turn off any redirect to another page. Default does not stop a HubSpot redirect, and a redirect can take the visitor off the page before the calendar opens.To send visitors somewhere after they book, use Add redirect on meeting booked on the Display Scheduler node instead.
3

Add the form with Catalog forms

In Signals, open the domain’s menu and select Catalog forms. Start on the page with the HubSpot form and select Open catalog mode. Select Add form on the HubSpot form, name it, and confirm. The form is active right away. See Your forms.
4

Map the HubSpot fields

In Forms, open the form and select Map fields. Map at least the email field to the person’s email, then the fields your routing uses, such as company or country. A mapping belongs to the field name, so it also applies to your other forms with a field of that name. See Field mapping for HubSpot forms.
5

Build the workflow

In Workflows, add a Form Submission trigger and set Connected Form to the HubSpot form. Add a Display Scheduler node and choose the Event. Add follow-up steps on the Booked and Not booked branches. See Routing and scheduling nodes.
6

Publish and test

Select Publish, then turn on the deployment switch so the status reads Live. Submit the HubSpot form on your live page with a test email. The loading indicator appears, then the calendar.

​
Field mapping for HubSpot forms

Default receives each HubSpot field under its HubSpot property name, such as email. Map those names to Default person and company fields. Default handles these HubSpot details for you: Mapping applies to new submissions only. A mapping belongs to the field name, not to 1 form: Map fields lists only this form’s fields, but a change there applies on every form in your workspace with a field of that name.

​
How HubSpot forms behave with the scheduler

  • The loading indicator shows after every HubSpot submission. The Pixel cannot tell in advance whether a HubSpot form is wired to a scheduler, so it shows the indicator until Default answers. For a form with no scheduler workflow, the indicator closes on its own.
  • HubSpot’s after-submit action still runs. A thank-you message appears in the form while the calendar opens over the page. A redirect to another page can take the visitor away before the calendar opens.
  • Early identification works for forms in your page. When the HubSpot form renders in your page, the Pixel sends the email to Default as soon as the visitor leaves the email field, so the calendar is ready sooner after submit.
  • Forms inside a cross-origin iframe are out of reach. Catalog mode and early identification cannot read into an iframe served from another domain. Check how your HubSpot embed renders the form if catalog mode shows no badge on it.

​
Route HubSpot form leads to the right rep

The Display Scheduler node decides who the visitor books with:
  • A team: create a Team event with a queue as a host. The queue’s policy picks the rep when the visitor books.
  • The existing owner: add a Match Record node with CRM set to HubSpot before the scheduler. Turn off Use event hosts and pass the matched record’s owner as the host, with a Fallback Host for when the owner is away. Each owner needs their HubSpot Owner ID mapped in Users.
  • A rule: a Rules of Engagement node picks the owner, and Latest resolved user becomes the host.
See Routing picks the host for every option.

​
Troubleshoot HubSpot forms

​
Check what the Pixel sees

  1. Before the Pixel loads, set window.__defaultPixel__logging__verbose = true on the page.
  2. Open the browser console and show verbose messages.
  3. Submit the HubSpot form with a test email.
Related: Sales scheduling software from Default