Skip to main content

Iframes

Tracking user submissions from forms embedded in iframes can be implemented using the Dreamdata analytics script. However, note that this script may not work with all iframe types due to variations in how forms are rendered within them.

For example, Marketo forms embedded in iframes require a specific script different from the general one provided here.

Setting Up Iframe Tracking​

To enable tracking for general iframe forms, include the following script in your main application:

dreamdata.load('<DREAMDATA_API_KEY>', {
  formTracking: {
    iframe: true,
  },
})

Embedding the Iframe Script​

Additionally, insert this script inside the iframe to ensure form submissions are properly identified and tracked:

<script
  charset="utf-8"
  id="dreamdata-iframe"
  type="text/javascript"
  src="https://cdn.dreamdata.cloud/scripts/analytics/next/iframe-identify-form.js"
></script>

Communication between an Iframe and a Parent Page​

This diagram illustrates the process activated by including the scripts mentioned above. In simple terms, we monitor for a message from the form inside the IFrame, which is sent to the Parent Page. We then relay this event to our Analytics server.