Tally Forms GTM Event Listener

Tally Forms

Overview

Tally is a modern, free form builder that embeds via an iframe. It communicates with the parent page using window.postMessage, sending a Tally.FormSubmitted event when a form is successfully completed. This listener intercepts that message and pushes a clean tally_form_submit event to the GTM dataLayer.

Event fired: tally_form_submit Credit: Courtney at Code and Tonic

Why Use This Listener

Tally's iframe architecture prevents GTM's built-in triggers from detecting submissions. This listener bridges the gap using the PostMessage API.

Common Use Cases

• Track lead form and survey completions as GA4 conversions
• Fire Google Ads conversion tags on Tally form submission
• Measure form completion rates across embedded Tally forms
• Build retargeting audiences from form submitters

Installation

<!-- GTM Custom HTML Tag: Tally Forms Listener -->
<script>
var handler = function(e) {
  if (typeof e.data === 'object' && e.data.event === 'Tally.FormSubmitted') {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({
      'event': 'tally_form_submit'
    });
  }
};

if (window.addEventListener) {
  window.addEventListener('message', handler, false);
} else if (window.attachEvent) {
  window.attachEvent('onmessage', handler);
}
</script>

Fire on: DOM Ready. Works in all modern browsers.

Data Layer Output

{
  "event": "tally_form_submit"
}

Trigger Configuration

GA4 Mapping

Debugging

Best Practices

1. Combine the Page URL variable with the trigger to track which page the Tally form is on
2. If using multiple Tally forms, consider adding form ID from e.data.formId to the push

Extended Version (with Form ID)

if (e.data.event === 'Tally.FormSubmitted') {
  window.dataLayer.push({
    'event': 'tally_form_submit',
    'tallyFormId': e.data.formId
  });
}

Related Listeners

• Typeform
• PaperForm
• Cognito Form