Learn business growth with Google Analytics 4 Forums Google Analytics 4 Troubleshooting Custom JavaScript Variables in Google Tag Manager

  • Troubleshooting Custom JavaScript Variables in Google Tag Manager

    Posted by Logan on 10 January 2023 at 1:28 pm

    I’m trying to make a Custom JavaScript variable in Google Tag Manager. I need to find out if a specific word shows up in the body of the web pages’ code to help me sort out the subcategories. Here’s what I have so far:

    function(){
    {var hasStellar = (document.body);
    var result = /stellar/.test(hasStellar);
    return result}}
    

    and I’ve used document.body like this:

    ".project-template-template-stellar-project.project-template-viewstem" +
    "plate-stellar-project.single.single-project.postid-20597.--nav-trans" +
    "parent.app-data.index-data.singular-data.s" +
    "ingle-data.single-project-data.single-project-data.template-stellar-project-data"
    

    But, when I preview it, the Custom JavaScript Variable gives me ‘false’. If you know how to fix this, or a better approach, I’d love to hear it!!!

    George replied 1 year, 3 months ago 3 Members · 2 Replies
  • 2 Replies
  • Nam

    Member
    17 June 2023 at 9:16 pm

    Sure, let me break it down for you. The function you’ve written is checking if the word ‘stellar’ is in your webpage’s code, right? But here’s the thing: you’re treating ‘document.body’ as a string, and it’s not. It’s actually an HTML object. So, instead of ‘document.body’, you’d want to use ‘document.body.outerHTML’. This gives you the HTML content of the body element as a string, and you can do your search in that.

    But that’s not all. Apparently there’s something called CSP (Content Security Policy) that can block your Google Tag Manager. So you might want to check if that’s happening. Simply look at your console for any error messages, and if you see something related to CSP, there’s your culprit.

    Lastly, the timing when you’re checking this function matters. If the body of your webpage isn’t fully loaded by the time your function is checking for the word ‘stellar’, it might not find it and return ‘false’. So make sure your function runs after the page is completely loaded.

    To summarize: swap ‘document.body’ to ‘document.body.outerHTML’, check for CSP errors, and ensure you’re running the function after the page is fully loaded.

  • George

    Member
    18 June 2023 at 7:32 pm

    The issue comes from the fact that you’re trying to use regex on the wrong kind of object. The document.body is an HTML object, not a string. If you want to scan the body of your HTML for a specific word, you need to convert the body to a string first. You can use the innerHTML property to achieve this. Your function would then look like this:

    `javascript
    function() {
    var bodyContent = document.body.innerHTML;
    var result = /stellar/.test(bodyContent);
    return result;
    }
    `
    So with this update, you are checking if the word “stellar” is anywhere within the HTML of your body, not within the body object itself.

Log in to reply.