Hey everyone! I’m working on our company website and need some help with a specific setup. We want to add a popup form where people can book demo calls with our team without leaving our main page.
Currently we’re using Webflow for the site and HubSpot for our CRM. The goal is to keep users on our website instead of sending them to an external HubSpot landing page when they want to schedule a meeting.
I’m looking for a way to embed the scheduling functionality directly into a modal or popup window that appears on our site. This would make the user experience much smoother since they won’t need to navigate away from what they’re reading.
Has anyone successfully implemented this kind of integration before? Any tips or guidance would be really appreciated!
Been running this setup for about 6 months now and there’s one thing the previous answers didn’t mention - you’ll want to test the popup dimensions thoroughly across different devices. The HubSpot meeting scheduler can be finicky with responsive design inside modals. I found that setting a minimum height of around 600px works best to avoid scrolling issues within the iframe. Also make sure to add some padding around the embed so it doesn’t look cramped. The integration itself is straightforward like others mentioned, but I’d recommend creating a fallback link that opens the full HubSpot page in a new tab just in case the popup fails to load properly on certain browsers or slower connections.
quick tip - dont forget to check if your hubspot plan includes the meetings tool becuase some lower tiers dont have it. learned this the hard way lol. also test the loading speed since iframes can slow things down sometimes
i did this too and it was easy! just take hubspot’s meeting iframe and add it to your webflow modal. super simple and keeps everything on the same page, which is nice for users.
You can achieve this by using HubSpot’s meetings embed code within a Webflow popup component. In your HubSpot account, navigate to the meetings tool and generate the embed code for your booking page. Then create a modal element in Webflow and paste the embed code into an HTML embed component inside the modal. Make sure to set the modal trigger to whatever button or link you want users to click. I implemented this solution last year and it works seamlessly - users can complete the entire booking process without ever leaving your main site. The only thing to watch out for is making sure your modal is sized appropriately since the HubSpot calendar interface needs adequate space to display properly on both desktop and mobile devices.