Populate a data layer key with a JavaScript value

I need help adding an event ID to my WordPress website pages to ensure that Enhanced eCommerce events sent to Google Tag Manager are not duplicated in GA4 and Facebook.

Currently, I am using the following function:

function generateEventID() {
    return 'xxxxxxxx.xxxx.4xxx.yxxx.xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
        return v.toString(16);
    });
}

This function generates a unique ID. Once generated, I want to include this ID as the value for the 'event id' as shown below:

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
    'event': 'page_id',
    'event_id': generateEventID()
});

If anyone could provide assistance with this, it would be greatly appreciated.

javascriptwordpressgoogle-tag-managergoogle-datalayerenhanced-ecommerce

Answer №1

One option is to incorporate a Community Template that creates an event ID as a dynamic variable for you:

This approach allows the event ID to be stored as a variable rather than in the dataLayer, enabling you to easily access it in other tags, such as facebook/meta.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Unable to disable background color for droppable element

For my project, I am working with two div boxes. My goal is to make it so that when I drag and drop box002 into another div box001, the background color of box001 should change to none. I have attempted to achieve this functionality using jQuery without s ...

javascriptjqueryhtmlcss

Issue with Saving Modal in Bootstrap 5: Button Does Not Function

I've been following the instructions on , but I'm facing an issue with getting the save button to work on my modal. Initially, I tried placing it within the form tag, but it ended up using the form action from the main view instead of the partial ...

javascriptasp.net-mvcasp.net-corebootstrap-modalbootstrap-5

"Upon pressing the submit button in the router.post function, a null value appears

In my form, I am attempting to redirect the page to the home URL after clicking the submit button. However, using res.redirect('/home') is not achieving the desired result. I have also tried using console.log("testing");, but that is not working ...

javascriptnode.jsformsexpresscontact-form

What is the process of caching images when they are loaded through a php script?

My PHP script acts as a random image generator by querying the database for user images and returning a random one. Below is the code snippet responsible for serving the randomly chosen image. header('Content-Transfer-Encoding: binary'); header( ...

phpjavascriptimagecaching

Function that is triggered repeatedly when modifying the state within it

Within my render method, I am calling a handlePageClick function like this: onPageChange={this.handlePageClick} The function itself looks like this: handlePageClick = data => { this.setState({ circleloading: true }); let names = ...

javascriptreactjs

Creating an image from the contents of a div is necessary in order to visually

I am looking to develop a software that can: receive text input from the user and place it in a specific div allow users to adjust font, color, and size based on their preferences enable image uploads as background save all customizations and send them v ...

phpjavascriptjqueryajaxprototype

Is there a way to showcase an array parameter in a url's format?

Objective Currently, I am developing a project using NextJS 12 and I am facing an issue with passing an array as a parameter to the query. Desired Outcome The expected format for passing the array as a parameter should look like this: /path?address_id=1 ...

javascriptnext.js

What is the best way to add a trigonometric shape to a web page?

Currently, I am undertaking a project that requires the insertion of a large number of trigonometrical shapes into a webpage. To provide some context, I am working on the conversion of an ancient book into HTML format. The challenge lies in the fact that c ...

javascripthtmlmathjaxtikz

Uncaught data emitted by Express route not received by socket.io client

I have encountered an issue where the data emitted from a socket in my ExpressJS route file is not being read by the client-side JavaScript. server.js var express = require('express'); var path = require('path'); var app = express(); ...

javascriptnode.jssocketsexpress

Retrieve the value of the chosen option from a dropdown menu by utilizing jQuery

I am facing an issue with retrieving the values of selected options. Allow me to elaborate, I have a list of options : <select> <option value='1'>Option1</option> <option value='2'>Option2</option> ...

javascriptphpjqueryarrays

Changing the icon on click in react: a step-by-step guide

I have two MUI icons that I need to toggle with every click. I created a component for them, and one of the props (called btnClicked) controls the state. However, when clicking on the component, the icon buttons do not change. Here is the code: import Reac ...

javascriptreactjsreact-hooksmaterial-uijsx

Difficulty: Issue with displaying Backbone collection using Mustache template

I'm new to backbone js and Mustache. I want to load a backbone collection on page load from rails json object to avoid making an extra call. However, I'm facing issues when trying to render the backbone collection using a mustache template. Here ...

javascriptjquerytemplatesbackbone.jsmustache

Error encountered: WebResource.axd is not found on the .net webforms website when accessed through Cloudfront

I am facing a challenge with migrating an existing .NET webforms site to work behind Cloudfront as all the webforms are breaking. Upon further investigation, it has been discovered that the site appears fine, but the webforms are breaking because the < ...

javascriptasp.netwebformsamazon-cloudfront

Removing the outer array of objects can be achieved by using a variety of

My goal was to eliminate the outer array of objects. I attempted to achieve this by using the code below: export class AppComponent implements OnInit { name = 'Angular'; EmployeeData=[ {"name": [{ "grade": &quo ...

javascriptangular

Ever-changing day, month, and year

The display shows the current date and time. I am attempting to convert what I currently have. function timeCount() { var today = new Date(); var day = today.getDate(); var month = today.getMonth() + 1; var year = today.getFullYear(); var ho ...

javascripthtml

How can you determine the current endpoint and sub-endpoint in WooCommerce?

Suppose the URL is: https://example.com/my-account/edit-address/billing https://example.com/my-account/edit-address/shipping I am attempting to determine if the current displayed endpoint is billing or shipping using the is_wc_endpoint_url function. Ho ...

phpwordpresswoocommerce

Ways to categorize by a particular date

const vehicleDetails = [ { "record_id": "2ff8212f-5ec9-4453-b1f3-91840a3fb152", "status_date_activity": { "On Rent": 1662021991000 } }, { "record_id": "c8c1 ...

javascriptnode.jsarraystypescriptreduce

Failure in SystemJS during ahead-of-time compilation due to missing NgZone provider

Previously, I have successfully used Angular's ahead-of-time compilation. However, after adding routing and lazy loading to my app, I am facing difficulties in making it work again. Upon updating my code to the latest 2.0 release, it functions well w ...

javascriptangulartypescript

Determining the Position of the Cursor Within a Div

When a link is clicked, a pop up is displayed. Here is the code for the pop up: <div class='' id="custom-popover"> <div class="arrow"></div> <h3 class="popover-title">Popover left</h3> <div class="pop ...

javascriptjquery

Bring NavLinks from a separate class into the NavBar Class in a React application

Hello! I am new to React and I am currently working on creating a navbar component using materialize css. I have separate classes for loggedinlinks and loggedoutlinks, but when I include them in my Navbar class and run the application, the links are not ap ...

javascriptreactjs