3

How can I add a macro into Google Tag Manager that would get the text of the in the class="content" div as shown here:

<article class="content">
              <h1>Meeting of the Committee</h1>

I'm trying to set up an Analytics event that will take the text of this h1 and put it into the event label. The action of the event will be clicking a button elsewhere on the page. So I would like this:

Category: Meeting Action: Add To Calendar Label: Meeting Of the Committee

I should also note that (annoyingly), there are multiple h1s on this page, but targeting ".content h1" will get me the text I need. I just don't know how to get that value into a macro.

Any help would be much appreciated. Thanks!

Reid
  • 105
  • 1
  • 8

2 Answers2

1

Since the h1 is not the clicked element it will not be automatically be stored in a macro.

So you might create a macro of the custom javascript type with the following function:

function() {
 return window.document.getElementsByTagName('h1')[0].innerText;
}

This extracts the text from the first h1 on the page (ideally there is only one h1) and returns it.

You might want to add some error checking in case there is no H1, plus there is some discussion if innerText should be used (here is a post about the differences between innerHTML, innerText, textContent etc), but as far as I can tell innerText works reasonably well.

Community
  • 1
  • 1
Eike Pierstorff
  • 31,996
  • 4
  • 43
  • 62
1

GTM h1 Text

  1. Create a variable in GTM
  2. Select CSS Selector
  3. Put H1 on the Element Selector
  4. Use the Variable to your Tags
lovelyramos
  • 9,379
  • 1
  • 17
  • 18