CODEWITHSUNDEEP
javascriptgoogle-tag-managertracking
SAKURA
SAKURA

Reputation: 986

Trigger Google Tag Manager Conditionally

I have a JavaScript page with several tabs. I want to trigger Google Tag Manager when someone clicks on the first tab.

When any of the tabs is clicked, it calls a "handleTabClick" function which updates the current tab index in Redux. Then it uses if-else statements based on the current tab index:

if (curretTabIndex === 0) {
   // should I add GTA trigger here?
   this.props.loadFirstPage()
}

Is it possible to add the GTA trigger in the if-conditional block?

If so, what would the code be? And how do I set the trigger to "listen" to it?

enter image description here

Upvotes: 1

Views: 2323

Answers (1)

XTOTHEL
XTOTHEL

Reputation: 5198

Based on the limited information on what the overall goal is. I would recommend you to use custom datalayer events.

Your trigger setup would look like this: enter image description here

Then you'd put this in your if statement or wherever you want GTM to trigger the tag that you want:

dataLayer.push({'event': 'first-tab-view'});

Depending on what you want to do, you can also pass on other information and make the trigger more generic so it is reusable throughout your code.

You can configure your trigger like so (calling the event "tab-view") so you can use it for other tabs: enter image description here

Then you'd run this trigger depending on the tab they're viewing:

dataLayer.push({
'my-tab': current-tab-var, //this would be a variable that would represent what the current tab number is
'event': 'first-tab-view'
});

Upvotes: 1

Related Questions