Tracking Users to certain areas of your site by Creating Google Analytics Events on the fly just by pasting code

This article will explain a faster way on how to track a user action on your website and fire a tracking event if the user visits that area. (You can check the end result at the end of this article).

It may be a div, a text, a link, an image (example: social media icon).

Dependencies:

1. This scripts assumes you are using gtag.js google analytics script.

For those who are still using the old analytics.js script, I would suggest to migrate to the new google analytics gtag.js.

2. This script also asumes you have jquery script installed on your website ( 90% of websites do)

Code to test if your site contains both dependencies:

‘$’

‘document.getElementsByTagName(“html”)[0].innerHTML.match(/.*gtag\.js.*/)’

Detailed Video How to use these to lines of code in your Chrome Browser:

Next Steps

1. Select the area you wish to track.It may be a div, a text, a link, an image (example: social media icon). selector app

In case you dont know how to choose CSS selectors I would suggest to install chrome plugin by clicking here . ( after installing chrome plugin check video on how to use below )

In the video below I explain how to select (by using CSS selectors ) the instagram icon. This way we will track the instagram icon clicks by an event.

Next we paste the code we copied, which in our case is: .

.et-social-instagram.et_pb_social_media_follow_network_2

2.Next we decide which kind of event we want to track ( example mouseover the icon, or clicking the icon). I am choosing clicking the icon event. And I prepare this code (notice I paste the same line of code above inside the “” below, I place my own names on Labeling the Event.

In this case I named the event “Click”, 
Event Category “Social Media — Instagram”, 
Event_label “instagram Icon Is Clicked”
Dont forget inside 
jQuery("to place here the selector of ig icon inside dblquotes")

The code sample you will use in your site is below:

jQuery(“.et-social-instagram.et_pb_social_media_follow_network_2”)
.on(“mouseover”,function(){gtag(
 ‘event’, ‘Click’, {
 ‘event_category’: ‘Social Media - Instagram’,
 ‘event_label’: ‘Instagram Icon Is Clicked’, 
});console.log(“Clicked!”)});

3. Paste the code inside the body tag, or footer tag of your site, in my case my wordpress theme has a section to paste javascript code.

4. Check results by clicking on instagram link and noticing an event firing live in google analytics Events Section. (Video below)