No idea if Events are working!


#1

Hi. I’m really confused as to whether my Events are set up correctly. I have taken advice on this before but some are still showing as zero and I have no way of knowing of this is because the Event is set up incorrectly or if there is actually no data to show.

For example, I have an Event called ‘Navigation: About (homepage)’. I want to track all clicks on the About button in my top navigation on here: https://www.aesinternational.com/

So taking your advice, I went to inspect the page source and I get this:

<a href="https://www.aesinternational.com/about" aria-haspopup="true" aria-expanded="false" role="menuitem">About</a>

I have set up my Event using that the JQuery Selector.

There are, however, no results showing since 17 April. I have used this method for others, like ‘Navigation: Retirement Solutions (homepage)’ and 3 results are showing. Is the first simply that no one is clicking on it?

I then took advice and was told this was the way to do it…I have one called ‘Navigation: Knowledge Library (Homepage)’. This one has the JQuery as simply:

a[href="https://www.aesinternational.com/knowledge-library"]

I inputted this myself (no inspecting of the page source). This one shows results.

Which method is correct? And how can I ever know if its working or simply has no clicks??


#3

Hi @RSteele, apologies for the frustrations here!

If you're using the JQuery method for this selector, this <a href="https://www.aesinternational.com/about" aria-haspopup="true" aria-expanded="false" role="menuitem">About</a>; would not be a valid JQuery method to use.

The reason being that JQuery relies on a CSS selector, but the above code contains HTML. Moving forward, this format: a[href="url_here"] is the way to go and should work. I'm currently digging into this issue in my own portal and will let you know what I find, as I'm still not seeing events show in your portal. I'll respond here when I have more info.

As an alternative, we do have a bookmarklet you can use, as shown here: https://knowledge.hubspot.com/events-user-guide-v2/how-to-create-clicked-element-events that should work.


#4

Hi @RSteele, after some testing, this is definitely the format you'll want to use for events using the Jquery route:

a[href="url_here"]

I tested both methods that you'd used on the same link in my own portal, and only the one that followed the format from above worked. I did notice that it took around 30s - 1min for the tracking code to update and actually start recording the events, but that could've been a caching issue.

Here's a test event I made in your portal: https://app.hubspot.com/analytics/383440/events/000006344383/log, it looks like the event has data associated with it, so it's working!


#5

Thank you for this!

So I have updated this Event in my portal: Navigation: About (homepage) to reflect what you say above. However, I am trying to track clicks on my top navigation and the 'about' page also appears in my footer. Am I right in thinking that this is going to track all clicks on the about page from the homepage? I did try and install the bookmarklet tool, but it wouldn't drag onto my favourites bar at all.

This is all very confusing as all the support I have had from HubSpot has told me to use the opposite of what you have (i.e this as a JQuery: About;`). But if you are confirming I need to use this: a[href="url_here"] for the JQuery route I will, but please confirm the issue around header/footer.

Thanks
Becky


#6

Hi @RSteele, I can certainly see how it would be confusing to get two different answers. Did you hear this information from Support? If you have a ticket number I'd be happy to dig into where the mixup in communication came from. Interesting about the bookmarklet. I will see if we have any open issues about that not working.

You are spot on with the assumption that the selector I created will track both clicks on the header and footer. to distinguish, you can use a more specific selector that encompasses the link in your header vs. the one in your footer.

For the header, something like this would work:

.header--main--nav a[href="url_here"]

and for the footer:

.footer--main a[href="url_here"]

These selectors are based off of the classes set on your header/footer in your HTML structure.

Just tested in your portal with this new event here: https://app.hubspot.com/analytics/383440/events/000006374284/log and it appears to be firing properly


#7

Thank you! If you check out ticket number #2004653, she appears to contradict you.

Would you mind, since this s hopefully going to mean I can check all my Events and make sure they are working, sending me a screenshot of where in my page source you get the selector '.header--main--nav' - I only have basic code knowledge and so I want to make sure I am always taking the right bits when i right click and choose 'inspect'.


#8

Thanks so much for that info! Just connected with Amanda and we're discussing this as we speak :slight_smile:

Attaching a screenshot here of the Chrome Developer Tools which I find by right clicking on a page > Inspect and then checking out the HTML source code. What I was trying to look for was a distinguishing class or ID that I could find that seems like it would be particular to the header/footer and not used anywhere else. Here's the screenshot:


#9

Really helpful thank you. :slight_smile:


#10

No problem @RSteele, and apologies for the mixup!