Highlighted

How to use header title for the event label to be sent to GA?

chriszp
Bronze Contributor
Bronze Contributor chriszp

Hi,

I am trying to track the links as shown in the screenshot (pink) and to give it the eventlabel of the corresponding Header Title (orange). How do I go about that? Thanks for any help!

eventtracking.png

I have the following extensions ready:

eventtracking2.png

DOM Ready JS Code:

// jQuery listener for all 'a' Tags at the Page
jQuery(document).on('click', 'a', function(e) {
    
    // Variable Declaration
  var tgt = jQuery(e.target);
  var clickURL = tgt.attr('href');
  var clickText = tgt.text().replace(/[^a-zA-Z0-9]+/g, "-");
  var clickClass = tgt.attr('class');
  var clickID = tgt.attr('id');
  var clickURLHostname = this.hostname;
  var clickURLPath = this.pathname;
  var clickElement = jQuery(e.target)[0];
  var clickType;

    // Check if the clicked Link is internal or External. 
    // Please edit 'PLACEHOLDER'
  if (clickURLHostname.indexOf("zweipunkt.com") === -1) {
    clickType = "external";
  }else {
    clickType = "internal";
  }
  
  // sent Tealium Event with all click Elements 
  utag.link({
    'tealium_event' : 'link_click',
    'click_url' : clickURL,
    'click_text' : clickText,
    'click_class' : clickClass,
    'click_id' : clickID,
    'click_urlHostname' : clickURLHostname,
    'click_urlPath' : clickURLPath,
    'click_type' : clickType,
    'click_element': clickElement
  });
});

 Thanks for any help! 

2 REPLIES 2

How to use header title for the event label to be sent to GA?

vinayreddy
Silver Contributor
Silver Contributor vinayreddy

Hi @chriszp,

In your link you have href links. Last portion of href link is titile. So, you can use the split function to get the last portion of the URL and pass it to the label. 

Here is the sample code you need to add.

var clickTitle = tgt[0].href.split("/")[tgt[0].href.split("/").length-1];

 

VR

How to use header title for the event label to be sent to GA?

Tealium Employee

Hi @chriszp 

You could take advantage of other jQuery functions to retrieve that dom element.

For example, you could get its value using the closest method

closest(): For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.

If the header was in an h2 element, you could use:

var title = tgt.closest("h2").text();


Hope that helps!