Troubleshooting Routing from HubSpot Forms

Integrating Calendly with HubSpot forms streamlines scheduling, but setup issues can arise. Here are FAQs and tips to optimize your Calendly-HubSpot routing integration.

My HubSpot form keeps redirecting to a thank you page and not a Calendly booking page, how do I fix that?

If leads aren't being directed to a Calendly booking page after submitting a HubSpot form, you can adjust the form's settings. To adjust the form's settings:

1. Go to your form in HubSpot.
2. Navigate to the Options tab.
3. Adjust your “What should happen after a visitor submits this form” setting not to “Display a thank you message.”

Troubleshooting HubSpot forms and Wix

If nothing happens after you paste the routing script onto your Wix website:

1. Ensure you're on the paid version of Wix. The free version will not allow you to enter custom code outside of an iframe.
2. Paste the following code in the Custom Code/Body-start area found in the Settings section:

<!-- Calendly inline widget begin -->
<link href="https://assets-staging.calendly.com/assets/external/widget.css" rel="stylesheet">
<script type="text/javascript" src="https://assets-staging.calendly.com/assets/external/forms.js" async></script>
<!-- Calendly inline widget end →

If your invitees are not redirected away from the form when they exit the booking page before scheduling:

1. Add the following code to your page template to redirect visitors when they close out the popup:

constcallback = (mutationList, observer) => {
for (constmutationofmutationList) {
if (mutation.type === 'childList') {
mutation.removedNodes.forEach((removedNode) => {
if (removedNode.className === 'calendly-overlay') {
window.open('https://calendly.com', '_self')
      }
    })
  }
}
};
constobserver = newMutationObserver(callback);
observer.observe(document.getElementsByTagName('body')[0], { childList:true });

2. Replace the Calendly URL in the snippet with the redirect URL that you want to use.
3. Add the following code below the Calendly.initHubSpotForm({ url: ... }) line as following:

<!-- Calendly routing form code begin -->
<linkhref="https://calendly.com/assets/external/widget.css"rel="stylesheet">
<scriptsrc="https://calendly.com/assets/external/forms.js"type="text/javascript"async></script>
<scripttype="text/javascript">
window.addEventListener('load', () => {
Calendly.initHubSpotForm({ url:"..." })
<Add the code snippet here>
 });
</script>
<!-- Calendly routing form code end -->