Allow loading new CTAs (Beta) outside of iframe

HubSpot Ideas
24

We’ve put together a script that you can use to update dataLayer. Detailed instructions on our blog.

<script>
 window.addEventListener("message", function(event) {

 // Ensure the message is from the expected origin

 if (event.origin !== "https://parent.yourwebsite.com") {
 return;
 }

 // Log the received message for debugging purposes
 console.log("Message received from iFrame:", event);

 // Log the entire event data object to understand its structure
 console.log("Event data object:", event.data);

 // Check for the specific form submission event
 if (event.data && event.data.eventName === "onCallToActionFormSubmitted") {
 console.log("Form submission data:", event.data.data);

 // Push the form submission event to the GTM dataLayer
 window.dataLayer = window.dataLayer || [];
 window.dataLayer.push({
 event: 'hubspot_form_submitted',
 hsformId: event.data.data.id || 'unknownForm', // This captures the Hubspot form ID
 formData: event.data.data || {} // This sends any additional form data, if available
 });
 }
 }, false);
</script>