Amelia Event Form Event Listener

Leverage this Amelia Event Registration Form event listener to capture and analyze when and how your website visitors interact with the Amelia Event Forms. You can then enhance the event registration processes, measure conversion rates, and optimize marketing campaigns using the data collected through Google Tag Manager and your analytics tools like Google Analytics, Piwik Pro, Matomo, etc., with the help of this listener script.

How to track Amelia Event Form Interactions and Registration Completions In Google Analytics or Ads Pixels with google tag manager

Here, I’ll walk you through using the Amelia booking form event listener with Google Tag Manager (GTM) to track form interactions and event registrations as events and conversions in analytics platforms like Google Analytics (GA4), Piwik Pro, and others. By following these steps, you can capture key data points from your Amelia forms to enhance your marketing and analytics capabilities.

Step 1: Add the Event Listener Script

Begin by creating a new Custom HTML Tag in Google Tag Manager. Copy the provided Amelia event listener script and paste it into the tag.

💡 Pro Tip: Set the trigger type for this tag to DOM Ready to ensure the event listener initializes after the page and the Amelia form is fully loaded.

What the Event Listener Does

The Amelia event form event listener tracks user interactions with the booking form and pushes them into the dataLayer as events. The event name for all interactions is ameliaActivity. The listener captures key moments in the booking process, including:

  • Form loaded
  • Event selected
  • Information step loaded
  • Payment step loaded
  • Booking confirmed
  • Booking completed (on-site or online)

By using this script, you can track the complete user journey, from viewing the form to completing a registration.

Step 2: Create a Custom Event Trigger

Next, create a Custom Event Trigger in GTM. Set the event name to ameliaActivity, which is the name emitted by the event listener for all tracked interactions. This trigger will be used to fire your tags whenever an Amelia interaction is detected.

Step 3: Set Up Data Layer Variables

To extract detailed information about each Amelia interaction, create the following Data Layer Variables in GTM:

  1. ameliaEvent
    • Description: Returns the type of interaction (e.g., form loaded, event selected, booking completed).
  2. ameliaData.event.id
    • Description: The unique ID of the event being registered for.
  3. ameliaData.event.name
    • Description: The name of the event.
  4. ameliaData.booking.event.price
    • Description: The price of the event.
  5. ameliaData.booking.customer.firstName
    • Description: The first name provided during registration.
  6. ameliaData.booking.customer.lastName
    • Description: The last name that was provided during the event registration.
  7. ameliaData.booking.customer.email
    • Description: The email address submitted during registration.
  8. ameliaData.booking.customer.phone
    • Description: The phone number submitted during registration.
  9. ameliaData.booking.customer.id
    • Description: The unique ID of the customer registering for the event.

💡 Pro Tip: Explore the full ameliaData object for additional information about form interactions that might be valuable for your analytics or marketing needs.

Step 4: Configure Marketing Tags and Pixels

Once your variables and triggers are set up, create your marketing tags in GTM (e.g., Google Analytics (GA4), Piwik Pro, Facebook Pixel). Attach the custom event trigger to these tags and use the variables in the tag configuration to add context to the Amelia booking events. For example:

  • Use ameliaEvent to classify the type of interaction.
  • Use ameliaData.booking.customer.email to pass customer email information to your analytics platform (if compliant with privacy regulations).
  • Use the event ameliaData.event object to capture the event-related information like name, ID, price, etc.

Implementation Notes:

The Amelia event listener script is usable in other Tag Management Solutions (TMS) and is not just limited to GTM. However, the setup steps and principles remain the same.

Scroll down this resource page to download a GTM recipe template to save time. Customize it for your setup to quickly start tracking Amelia form interactions and conversions.

With this implementation, you’ll have a robust setup to track and analyze Amelia’s event registration form data, enabling more informed marketing decisions and deeper audience insights.

<script>
(function() {
// Initialize dataLayer if it doesn't exist
window.dataLayer = window.dataLayer || [];

// Utility function to push events to dataLayer
function pushToDataLayer(eventType, eventData) {
window.dataLayer.push({
event: "ameliaActivity",
ameliaEvent: eventType,
ameliaData: eventData || {}
});
}

// Define Amelia hooks
window.ameliaActions = {
// Form loaded
ViewContent: function(success, error, data) {
pushToDataLayer("formLoaded", data);
console.log("Amelia Hook: Form Loaded", data);
},

// Event selected
SelectEvent: function(success, error, data) {
pushToDataLayer("eventSelected", data);
console.log("Amelia Hook: Event Selected", data);
},

// Info step loaded
InitInfoStep: function(success, error, data) {
pushToDataLayer("infoStepLoaded", data);
console.log("Amelia Hook: Info Step Loaded", data);
},

// Payment step loaded
InitiateCheckout: function(success, error, data) {
pushToDataLayer("paymentStepLoaded", data);
console.log("Amelia Hook: Payment Step Loaded", data);
},

// Confirm button clicked
beforeBooking: function(success, error, data) {
pushToDataLayer("confirmButtonClicked", data);
console.log("Amelia Hook: Confirm Button Clicked", data);

// Call success callback to continue the booking
if (typeof success === "function") {
success();
}
},

// On-site booking completed
Schedule: function(success, error, data) {
pushToDataLayer("onSiteBookingCompleted", data);
console.log("Amelia Hook: On-Site Booking Completed", data);
},

// Online booking completed
Purchased: function(success, error, data) {
pushToDataLayer("onlineBookingCompleted", data);
console.log("Amelia Hook: Online Booking Completed", data);
}
};

// Log a warning if Amelia hooks aren't available
if (typeof window.ameliaActions === "undefined") {
console.warn("Amelia hooks are not properly initialized. Ensure this script runs after Amelia is loaded.");
}
})();
</script>

Video of how to use the listener

Related Event Listener

Amelia Appointment Booking Form

Use this Amelia Appointment Booking Form event listener to measure the booking form flow and completion.

GetFeedback

Collect data on how users interact with the GetFeedBack widget in your measurement tool.

WSForm

Track WSForm errors and submissions as conversions to enhance your marketing and advertising strategies.

download the google tag manager recipe for tracking Amelia Event Form Interactions and Registration Completions In Google Analytics or Ads Pixels

we make you smarter with data

made with ❤️

The DumbData Team
Before you leave, try out these free tools.
FREE GA4 AUDIT TOOL & UTM AUDIT TOOL