Setting up GTM to Capture SwitchLive Events

Step 1: Create an Event Listener for SwitchLive
Use the following JavaScript code to listen for the SwitchLive event:

 window.addEventListener("message", function (e) {
    if (typeof e.data.message_type != 'undefined' && e.data.message_type === 'switchlive') {
        var switchLiveEvent = e.data;
        console.log(switchLiveEvent, '<<< SWITCH LIVE EVENT');

        // Push the event to the GTM Data Layer
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({
            event: 'SwitchLiveEvent',
            switchLiveData: switchLiveEvent // Capture the event details
        });
    }
}); 

1. Open your GTM container.
2. Go to Tags > New > Tag Configuration > Custom HTML.
3. Copy and paste this code snippet into the tag (wrap the code in opening and closing <script> tags in GTM).
4. Set the trigger to All Pages (or specific pages where the embed code runs).
5. Save the tag.

Step 2: Create a Custom Event Trigger

1. In GTM, navigate to Triggers > New > Trigger Configuration > Custom Event.
2. Set the Event Name to SwitchLiveEvent (matching the event in the Data Layer).
3. Name the trigger, e.g., SwitchLive Event Trigger.
4. Save the trigger.

Step 3: Create a Data Layer Variable

1. Go to Variables > New > Variable Configuration > Data Layer Variable.
2. Set the Variable Name to switchLiveData.
3. Name the variable, e.g., SwitchLive Data.
4. Save the variable.

Step 4: Set Up a Tag to Capture Events

Send Data to Google Analytics 4 (GA4)

1. Create a GA4 Event Tag:
   1. Go to Tags > New > Tag Configuration > Google Analytics: GA4 Event.
   2. Select your Measurement ID.
   3. Set the Event Name to switch_live_event.
2. Add Event Parameters:
   1. Under Event Parameters, click Add Row.
   2. Set the Parameter Name to switch_live_data.
   3. For the Value, select the SwitchLive Data variable created earlier.
3. Assign the Trigger:
   1. Use the SwitchLive Event Trigger.
4. Save the tag and publish.

Step 5: Test the Implementation

1. Open GTM in Preview Mode.
2. Trigger the SwitchLive event on your website (e.g., interact with the widget).
3. Verify in the GTM Preview Console:
   1. Check that the SwitchLiveEvent appears in the Data Layer.
   2. Confirm the appropriate tag fires.
4. Check your analytics or logging system to ensure data is recorded.

Troubleshooting Tips

1. Double-check variable and event names for typos.
2. Check your browser console to ensure that the SwitchLive event is being emitted by the embed codes. You can paste the script below into your console and then begin clicking around within the widgets to ensure that the SwitchLive event is firing.

window.addEventListener("message", function(e){  
    if (typeof e.data.message_type != 'undefined' && e.data.message_type == 'switchlive'){  
        var switchLiveEvent = e.data;  
        console.log(switchLiveEvent, '\<\<\< SWITCH LIVE EVENT')  
    }  
});

Please reach out to your Implementation Manager or CSM to further assist you if you have any issues.