I’m receiving traffic from Google Ads to a landing page that features a simple lead generation form. Unfortunately, I’m unable to alter the form itself or its submission endpoint.
Here’s my challenge: I want to send the form data to multiple endpoints, but I can only work with Google Tag Manager and Google Analytics.
My proposed method: I’d like to use GTM to intercept the form data through a custom script and forward it to a Zapier webhook. Once the data reaches Zapier, it can route the information to several other services.
Is this feasible? If it isn’t, what alternative approaches can I use to duplicate the form data and send it to another service without disrupting the original submission process?
totally! just create a submit trigger in GTM with a custom HTML tag. use fetch() to send the data to your zapier webhook. don’t forget to add preventDefault() so it doesn’t mess up the form submission!
I’ve done this exact setup for a client with the same constraint. Works great but timing is crucial. Set up a Form Submission trigger in GTM, then use a Custom HTML tag to grab form values with document.getElementById() or querySelector. The trick is adding a small delay before calling the webhook - I usually go with setTimeout at 100-200ms so the original form processes first. Structure your Zapier webhook payload as JSON and add error handling so your form keeps working even if the webhook craps out.
I’ve dealt with this GTM webhook stuff too. Skip trying to intercept form elements directly - push your form data to dataLayer on submit instead, then let GTM grab it from there for the webhook. You’ll have way better control over the data format and won’t miss field values. Quick heads up: Zapier webhooks are finicky about headers, so make sure you’re sending ‘application/json’ in your fetch. If you hit CORS problems, just proxy the request through a serverless function instead of calling Zapier straight from the browser.