Search for the Article

Track Window.alert() pop up message in Google Tag Manager

What is Window.alert() Pop up

The window.alert() function is a built-in function in web browsers that displays a pop-up window with a message to the user. It is commonly used in JavaScript code to provide feedback or prompt the user to take action.
As for why it can be hard to track and inspect, it is because the window.alert() function interrupts the normal flow of the code execution and blocks further execution until the user dismisses the pop-up window. This can make it difficult to debug the code or track down issues, especially if the alert is triggered by an unexpected condition.
Additionally, the content of the alert message is often not logged in the console or in server-side logs, making it harder to see what the user saw or to identify any patterns in the messages being displayed.

However, you can modify the window.alert() function to log the messages to the console or a server-side log file. One way to achieve this is by overriding the window.alert() function with your own implementation that includes logging. Here's an example:

Java script to track Window.alert() Pop up


// Override the window.alert() function
window.alert = function(message) {
  console.log('Alert message: ' + message); // log to console
  // send message to server-side log file via AJAX
  // ...
  // display the alert box
  originalAlert(message);
};

// Save a reference to the original window.alert() function
var originalAlert = window.alert;

// Use the modified window.alert() function to display alerts
window.alert('This message will be tracked.');

and If you want to track message inside this alert winow, then copy the below code and paste it your custom html container:



Tracking with Google tag Manager - Step by Step


  1. Create a custom HTML tag in Google Tag Manager:

    • Go to "Tags" in the left menu and click "New" to create a new tag.
    • Select "Custom HTML" as the tag type.
    • Paste the following code in the HTML field:
  2. Set up a trigger for the custom event:

    • Go to "Triggers" in the left menu and click "New" to create a new trigger.
    • Select "Custom Event" as the trigger type.
    • Enter "alert" as the event name.
  3. Create a Google Analytics event tag:

    • Go to "Tags" in the left menu and click "New" to create a new tag.
    • Select "Google Analytics: Universal Analytics" as the tag type.
    • Choose the Google Analytics tracking ID you want to use.
    • Select "Event" as the track type.
    • Enter a category, action, and label for the event, such as "Alert", "Popup", and "Message".
  4. Attach the trigger to the Google Analytics event tag:

    • In the "Triggering" section of the Google Analytics tag, click "Choose a trigger".
    • Select the custom event trigger you created in step 2.
  5. Save and publish your changes:

    • Save your custom HTML tag, custom event trigger, and Google Analytics event tag.
    • Click "Submit" in the top right corner of the Google Tag Manager interface to publish your changes.