Can GA4 track when appointments are booked in Square Appointments?
I am trying to track when appointments are scheduled from the Square embedded code that I have placed on my personal business website. The main purpose is for conversion tracking with Google Ads, so that when someone books a specific type of appointment, a tag can be fired in Google Analytics, thus successfully tracking that conversion.I have entered my GA4 Tracking ID in my Square Online Tracking Tools section, but I see no way that my GA4 can receive any data of booked appointments.
With research, I have discovered that the embedded code uses an <iframe> for the entire scheduling process, so my google tags on my personal business website will never see this happen. Every part of the scheduling process takes place in squareup.com via the <iframe>
I have tried to access the <iframe> code, but I don’t believe square allows any access to it, therefore I was unable to attempt a parent child data push that has worked for other <iframe> ecommerce situations.
The Tracking Tools section of Square Online does allow for one to enter GA4 tracking ID, Google Tag Manager code, which I have done. Also allow additional code, up to 2000 characters. However, my understanding is that the Square Online section is not connected to the url utilized by the <iframe>, and I see no way for data from booked appointments from the <iframe> to be sent back to GA4.
Does anyone know how I can have a tag fire in GA4 after someone schedules an appointment from the Square embedded code <iframe> on my person business website?
Thank you.
Sincerely,
Brad W.
Details
Integrations
The short answer is:
The way to reliably track appointments booked within the third-party Square iframe, which is inaccessible to your on-page Google Tag Manager (GTM) implementation, is by leveraging Square’s webhooks from their Bookings API to trigger a server-side event to Google Analytics 4 (GA4) via the Google Analytics Measurement Protocol.
You’ll need an intermediary server environment, like a server-side Google Tag Manager (sGTM) container hosted on Stape or Google Cloud Platform (GCP), to receive the booking.created webhook, process its data, and then construct and send the hit to GA4 using the Measurement Protocol.
This bypasses the iframe limitation entirely by tracking the conversion at the source system level, which is Square’s server.
The long answer is:
Since the appointment scheduling process is encapsulated within an <iframe> sourced from squareup.com, your client-side GTM, installed on your main domain, is unable to “see” or interact with the events occurring inside that frame due to same-origin policy security restrictions, confirming your own diagnosis.
The solution must move to a server-side approach where the conversion event is captured directly from the Square system.
The Square Bookings API provides webhooks, specifically the booking.created event, which is triggered by Square’s server the moment an appointment is successfully scheduled.
This webhook contains all the essential details about the booking, such as service type, date, and customer information.
You must configure a Webhook Endpoint in your Square Developer settings – a unique, secure HTTPS URL – that points to your server-side environment.
This server environment, optimally a server-side Google Tag Manager (sGTM) container hosted on Stape or GCP, will be the destination for Square’s webhook payload.
Within the sGTM container, you’ll configure a GA4 Measurement Protocol tag to fire when a request is received at that endpoint, specifically processing the booking.created event.
This tag will extract the relevant information (like a unique transaction ID and appointment value, if available) and send it directly to your GA4 property as a custom event, such as appointment_booked, using the Google Analytics Measurement Protocol.
Crucially, you should also pass the user’s client_id (captured from your website and sent to the server in a preliminary request, or retrieved from a first-party cookie set by sGTM) with the Measurement Protocol hit to stitch the server-side conversion back to the user’s client-side session, enabling accurate attribution for your Google Ads campaigns.
Using a server-side platform like Stape for sGTM hosting is a highly cost-effective and scalable choice compared to managing a dedicated server on a cloud provider, as it is specifically optimized for this kind of server-side data collection.
Furthermore, integrating BigQuery with your GA4 property (which is free up to a certain limit) is highly recommended; once the appointment data is in GA4, BigQuery acts as a data warehouse where you can join the booked appointment data from the Measurement Protocol with other customer data you might have, creating a richer, conversion-focused dataset for advanced analysis in Looker Studio, which can then be powered by the BigQuery API for dynamic reporting dashboards.
About The Author
