Track form conversions (GTM)
Report successful form submissions in the embedded form to Google Tag Manager and your own scripts
When you embed a form on your website, it runs in an iframe on the SimpliServ domain. Your tracking code (Google Tag Manager, Google Analytics, …), by contrast, runs on your domain – for security reasons the two can't access each other directly.
So that you can still measure a successful submission, the form reports every successful submission to the surrounding page. With the script widget this automatically becomes a dataLayer event – in GTM you only have to create a trigger.
Tracking works reliably only with the script widget (embed.js), not with the simple iframe. The widget runs on your page and can therefore write to your dataLayer. For the simple iframe there's a manual variant further down.
With Google Tag Manager
Prerequisite: the form is embedded via the script widget:
<div data-simpliserv-form="TOKEN" data-simpliserv-slug="SLUG"></div>
<script src="https://simpliserv.app/embed.js" async></script>As soon as someone submits the form, the widget writes the following event into your page's dataLayer:
window.dataLayer.push({
event: 'simpliserv_form_submit',
simpliserv: {
formId: 123, // ID of the form
formToken: 'abc…', // public token of the form
submissionId: 456, // ID of this submission
},
})Setup in GTM
Create a trigger
In GTM, create a new trigger of type Custom event. Enter as the event name exactly:
simpliserv_form_submitThe trigger then fires on every successful form submission.
Create variables (optional)
If you want to pass the form or submission ID to your analytics tool, create a data layer variable each:
| Variable type | Data layer variable name |
|---|---|
| Data layer variable | simpliserv.formId |
| Data layer variable | simpliserv.submissionId |
Link a tag
Create your tag (e.g. a GA4 event "generate_lead" or a conversion of your ad platform) and assign it the simpliserv_form_submit trigger. Via the variables from step 2 you can pass formId / submissionId as event parameters.
Test
In GTM, open the preview mode (Tag Assistant), load your page with the embedded form and submit it as a test. In Tag Assistant the simpliserv_form_submit event must appear and trigger your tag. Then don't forget to publish.
Without a tag manager (your own script)
You can also catch the event directly with JavaScript – for example to show a thank-you page or call your own tracking function.
With the script widget, embed.js additionally fires a DOM event on your page:
<script>
window.addEventListener('simpliserv:form:submit', function (event) {
// event.detail = { formId, formToken, submissionId }
console.log('Form submitted', event.detail)
})
</script>With the simple iframe (without embed.js) you instead listen directly to the form's postMessage. Always check event.origin so only messages from SimpliServ are processed:
<script>
window.addEventListener('message', function (event) {
if (event.origin !== 'https://simpliserv.app') return
var data = event.data
if (!data || data.type !== 'simpliserv:form:submit') return
// data.formId, data.formToken, data.submissionId
console.log('Form submitted', data)
})
</script>Replace https://simpliserv.app with the domain from which you load the form or embed.js, if SimpliServ runs under its own domain.
Related topics
- Building forms — design, embed and evaluate forms
- Create workflows — use form submissions as a trigger for automated flows
How is this guide?