A dataLayer.push() is a JavaScript function used to send event data to a data layer, typically used in website tracking and analytics. It allows you to record user interactions and other relevant information as they occur on your site.
Understanding dataLayer.push()
The dataLayer.push() function is part of the Google Tag Manager (GTM) and related data tracking implementations. It sends data to the data layer which acts like a temporary storage for the data before GTM uses it to trigger configured tags. It doesn’t perform any tracking or analytics itself but feeds data into the system that does.
How it Works
- User Action: When a user interacts with your website, such as clicking a button, submitting a form, or viewing a specific page, this action triggers a specific event that you may want to track.
- dataLayer.push(): You use
dataLayer.push()in your site's code to send an object containing information about the event into the data layer. This object is a JSON object that includes event name, additional properties or values you want to record. - Data Layer: The data layer is an array-like object that stores the pushed event data.
- Tag Manager: Tools like Google Tag Manager (GTM) listen for changes in the data layer. When a
dataLayer.pushoccurs, it can be configured to trigger the appropriate tracking tags based on the event's name and associated data. - Tracking and Analytics: The triggered tags then send the data to analytics platforms or other services, allowing you to monitor and analyze your site's usage.
Example
The following code shows how to use dataLayer.push() when a user clicks a button:
<button onclick="dataLayer.push({'event': 'login'});">Button 1</button>In this example:
onclickis an event handler that triggers when the button is clicked.dataLayer.push({'event': 'login'});sends an object to the data layer. This object contains a key-value pair, where the key is'event'and the value is'login'. This marks a custom event, which is the user’s login attempt, that can now be tracked using GTM.
Key Concepts of dataLayer.push()
| Concept | Description |
|---|---|
| Event Data | The JSON object sent to the data layer contains information to help track the event. You define which keys and values should be included. |
| Event Name | A standard key is event, whose value is often a custom defined string representing the type of action (e.g., 'login', 'add_to_cart', 'video_played'). It acts as a trigger in your tag manager. |
| Data Layer | A JavaScript array-like object used by tag managers as a storage for pushed data. |
| Tag Manager | A tool, such as GTM, to handle tags which use pushed data from data layer for event triggers for different tracking platforms. |
Practical Insights
- Consistent Naming: Use consistent naming conventions for your events to make analysis easier.
- Detailed Information: Include as much relevant data as you can within each
dataLayer.push()event to ensure you capture enough context. - Debugging: Use the browser’s developer tools and GTM's preview mode to check that the data is pushed correctly to the data layer.
Benefits of dataLayer.push()
- Centralized Data Layer: Manages data in one place.
- Flexibility: Easily integrates with tracking platforms and tools.
- Scalability: Handles complex tracking requirements.
- Efficiency: Reduces the need to modify code when new tracking is needed.
- Organization: Keeps data organized which is useful for reporting.
In summary, dataLayer.push() is a core function for capturing and managing event-based data on a website, facilitating effective tracking and analysis.
