Google Tag Manager Integration

A detailed guide for integrating Google Tag Manager (GTM) with FIXR widgets to track eCommerce events.

Prerequisites

To enable GTM integration with FIXR widgets, you must either:

Add the data-enable-gtm attribute to your FIXR widget script tag, or
Enable GTM plugin in your ticketshop settings

Overview

The FIXR widgets can send eCommerce events to your data layer, enabling you to track user interactions such as ticket views, cart actions, and purchases through Google Tag Manager (GTM). This guide provides instructions for setting up triggers, variables, and tags to capture these structed payloads for tracking.

Event Name	Description	Typical Use Case
`view_item`	Fired when a user views ticket details for an event.	Track ticket impressions.
`add_to_cart`	Fired when a user adds tickets to their cart.	Track cart additions.
`remove_from_cart`	Fired when a user removes tickets from their cart.	Track cart removals.
`begin_checkout`	Fired when a user starts the checkout process.	Track checkout initiation.
`purchase`	Fired when a user completes a purchase.	Track successful purchases.

Event Details and Payloads

Each event includes a structured payload wrapped in an ecommerce object in the data layer. Below are the details for each event, including the payload structure and the types of data included.

`view_item`

Description: Triggered when a user views ticket details for an event.

Payload:

{
  event: "view_item",
  ecommerce: {
    currency: string, // Currency code (e.g., "GBP")
    value: number, // Total value of the tickets
    items: Array<{
      item_id: string, // Ticket ID
      item_name: string, // Ticket name
      item_brand: string, // Event organiser's name (salesAccount.name)
      affiliation: string // Always "FIXR"
    }>
  }
}

Example:

{
  event: "view_item",
  ecommerce: {
    currency: "GBP",
    value: 50.00,
    items: [
      {
        item_id: "67890",
        item_name: "General Admission",
        item_brand: "Festival Co",
        affiliation: "FIXR"
      }
    ]
  }
}

`add_to_cart`

Description: Triggered when a user adds tickets to their cart.

Payload:

{
  event: "add_to_cart",
  ecommerce: {
    currency: string, // Currency code
    value: number, // Total value (price * quantity)
    items: Array<{
      item_id: string, // Ticket ID
      item_name: string, // Ticket name
      item_brand: string, // Event organiser's name
      affiliation: string, // Always "FIXR"
      quantity: number, // Number of tickets added
      price: number, // Price per ticket
      item_category: string // Event name and ID (e.g., "Summer Music Festival (12345)")
    }>
  }
}

Example:

{
  event: "add_to_cart",
  ecommerce: {
    currency: "GBP",
    value: 100.00,
    items: [
      {
        item_id: "67890",
        item_name: "General Admission",
        item_brand: "Festival Co",
        affiliation: "FIXR",
        quantity: 2,
        price: 50.00,
        item_category: "Summer Music Festival (12345)"
      }
    ]
  }
}

`remove_from_cart`

Description: Triggered when a user removes tickets from their cart.
Payload: Identical structure to add_to_cart.

Example:

{
  event: "remove_from_cart",
  ecommerce: {
    currency: "GBP",
    value: 50.00,
    items: [
      {
        item_id: "67890",
        item_name: "General Admission",
        item_brand: "Festival Co",
        affiliation: "FIXR",
        quantity: 1,
        price: 50.00,
        item_category: "Summer Music Festival (12345)"
      }
    ]
  }
}

`begin_checkout`

Description: Triggered when a user starts the checkout process by reserving tickets.

Payload:

{
  event: "begin_checkout",
  ecommerce: {
    currency: string, // Currency code
    value: number, // Total reservation value
    items: Array<{
      item_id: string, // Ticket ID
      item_name: string, // Ticket name
      item_brand: string, // Event organiser's name
      affiliation: string, // Always "FIXR"
      quantity: number, // Number of tickets
      price: number, // Price per ticket
      item_category: string, // Event name and ID
      coupon?: string // Promo code, if applied
    }>
  }
}

Example:

{
  event: "begin_checkout",
  ecommerce: {
    currency: "GBP",
    value: 90.00,
    items: [
      {
        item_id: "67890",
        item_name: "General Admission",
        item_brand: "Festival Co",
        affiliation: "FIXR",
        quantity: 2,
        price: 45.00,
        item_category: "Summer Music Festival (12345)",
        coupon: "SUMMER10"
      }
    ]
  }
}

`purchase`

Description: Triggered when a user completes a purchase.

Payload:

{
  event: "purchase",
  ecommerce: {
    transaction_id: string, // Unique transaction identifier (reservation.idempotencyKey)
    currency: string, // Currency code
    value: number, // Total purchase value (excludes ticket protection price)
    sha256_customer_email: string // Hash of customer email
    items: Array<{
      item_id: string, // Ticket ID
      item_name: string, // Ticket name
      item_brand: string, // Event organiser's name
      affiliation: string, // Always "FIXR"
      quantity: number, // Number of tickets
      price: number, // Price per ticket
      item_category: string, // Event name and ID
      coupon?: string // Promo code, if applied
    }>
  }
}

Example:

{
  event: "purchase",
  ecommerce: {
    transaction_id: "abc123",
    currency: "GBP",
    value: 90.00,
    sha256_customer_email: "3ec12cb8d976128dab5c4e95afa766b2006a6df2ae1ba98ece9b912603b5da6a",
    items: [
      {
        item_id: "67890",
        item_name: "General Admission",
        item_brand: "Festival Co",
        affiliation: "FIXR",
        quantity: 2,
        price: 45.00,
        item_category: "Summer Music Festival (12345)",
        coupon: "SUMMER10"
      }
    ]
  }
}

Data Layer Variables

Common Variables

All ecommerce events include these base properties in the data layer:

event: The event name (e.g., "view_item", "purchase", type: string)
ecommerce.currency: The transaction currency (e.g., "GBP", type: string)
ecommerce.value: The total value of the items (type: number)
ecommerce.items: An array of product items (type: Array<object>)

UTM and Campaign Tracking

All events automatically include UTM parameters and Google Click ID (GCLID) when available. These parameters help track the effectiveness of marketing campaigns and traffic sources:

utm_campaign: Identifies specific marketing campaigns
utm_content: Differentiates similar content or links within a campaign
utm_medium: Identifies marketing mediums (e.g., email, cpc, social)
utm_source: Identifies traffic sources (e.g., google, newsletter)
utm_term: Tracks search terms used in paid campaigns
gclid: Google Click ID for tracking Google Ads performance

These parameters are automatically captured from the URL parameters when users arrive at your site and are included in all subsequent events.

Item Properties

Each item in the items array includes:

item_id: Unique identifier for the ticket (type: string)
item_name: Name of the ticket (type: string)
item_brand: Name of the event organiser (type: string)
affiliation: Always "FIXR" (type: string)

Additional properties for add_to_cart, remove_from_cart, begin_checkout, and purchase events:

quantity: Number of tickets (type: number)
price: Price per ticket (type: number)
item_category: Event name and ID (e.g., "Summer Music Festival (12345)", type: string)
coupon: Applied promo code, if any (type: string, optional)

Specific to purchase:

transaction_id: Unique transaction identifier (type: string)
sha256_customer_email: SHA-256 hash of the customer’s email address (type: string).

Setting Up GTM

Follow these steps to configure GTM to capture FIXR widget events.

1. Create Data Layer Variables

Navigate to Variables in your GTM workspace.
Click New under User-Defined Variables.
In variable configuration, choose “Data Layer Variable”.
Create Data Layer Variables for the following keys with the corresponding Data Layer Variable Name:
- event (e.g., "view_item", "purchase")
- ecommerce.currency
- ecommerce.value
- ecommerce.items
- ecommerce.transaction_id (for purchase events)
- ecommerce.coupon (optional, for begin_checkout and purchase)
- utm_campaign
- utm_content
- utm_medium
- utm_source
- utm_term
- gclid

2. Create Triggers

Set up triggers for each event type:

Navigate to Triggers in GTM.
Click New.
Create Custom Event triggers for the following event names:
- view_item
- add_to_cart
- remove_from_cart
- begin_checkout
- purchase

3. Create Tags

Create tags to send event data to your analytics platform (e.g., GA4):

Navigate to Tags in GTM.
Click New.
Choose the tag type (e.g., Google Analytics: GA4 Event).
Configure the tag with the appropriate variables.
Assign the corresponding trigger.

Example GA4 eCommerce tag configuration for purchase:

Tag Type: Google Analytics: GA4 Event
Configuration Tag: Your GA4 Configuration Tag
Event Name: purchase
Event Parameters:
  // You can add custom parameters here if needed,
  // but the standard ecommerce object is usually handled automatically.
Trigger: purchase

Testing Your Implementation

Enable GTM’s Preview and Debug mode.
Navigate to your website with the FIXR widget.
Interact with the widget (e.g., view events, add tickets to cart, complete a purchase).
Verify that events are firing correctly in the GTM preview panel.
Check that data is being received in your analytics platform (e.g., GA4 DebugView).

Troubleshooting

Common issues and solutions:

Events Not Firing
- Make sure you have either:
  - Added the data-enable-gtm attribute to your FIXR widget script tag, or
  - Enabled the GTM plugin in your ticketshop settings
- Verify that GTM is properly installed on your site (check for the GTM snippet in the page source).
Missing or Incorrect Data
- Verify that Data Layer Variable names in GTM match the data layer structure exactly.
- Check trigger conditions to ensure they are firing for the correct events.
- Use the browser’s developer console to inspect the data layer (dataLayer.push events).