- TLC Home Home
- Discussions Discussions
- Documentation Documentation
- Knowledge Base Knowledge Base
- Education Education
- Blog Blog
- Support Desk Support Desk
01-12-2016 04:19 AM
Hi,
I have been trying to set up a jQuery handler that will fire an event every time that a user clicks to buttons that lead to external pages and populate the event label dimension with the href of each link clicked.
How do I do it?
Thank you very much in advance.
Solved! Go to Solution.
01-12-2016 08:20 AM - last edited on 01-12-2016 09:37 AM by kathleen_jo
Hi @defelicemattia,
You'll need some jQuery that will parse through all of the hyperlinks on your page. Hopefully the following code will get you on your way.
You can see how this works by copying the code below and pasting into the console while viewing a page on your site.
hostname = new RegExp(location.host); console.log ('hostname: ' + hostname); // Act on each link jQuery('a').each(function(){ // Store current link's url var url = jQuery(this).attr("href"); if (typeof url != 'undefined') { if (url.length > 0) { // Test if current host (domain) is in it if(hostname.test(url)){ // If it's local... do nothing } else if(url.slice(0, 1) == "#"){ // It's an anchor link do nothing } else if(url.slice(0, 1) == "/"){ // It's also local... do nothing } else if(url.indexOf("tel") == 0){ // It's a phone number... do nothing } else if(url.indexOf("javascript") == 0){ // It's javascript... do nothing } else { // a link that does not contain the current host console.log ('set jQuery click handler for external link: ' + url) ; jQuery(this).on( "mousedown", function() { // Do your setup for the utag.link call
console.log("External link clicked, url: " + jQuery(this).attr('href')); }); } }} });
I've left the actual call to utag.link for you to complete. Also, may notice hyperlinks that are picked up that you don't want a listener set up. When running the above in the console, I noticed on a couple sites a telephone number as a hyperlink; hence the code block that ignores anything starting with 'tel'. You may find the need to add additional code to block others on your site.
You would add the code to a JavaScript extension and scope it to DOM Ready.
Please let me know how this turns out.
Thanks, David
01-12-2016 09:52 AM
Another user asked the same question yesterday. Are the two of you working together? :)
The soltuion is similar:
01-19-2016 06:20 AM
@brian_kranson Thank you for your answer but no we are not working together.
07-27-2016 08:44 AM
Thanks Kathleen!
I just tried the code for tracking external links and it works great!
I had a small issue that I thought is worth sharing. At the beginning when I set the extension to fire on 'mousedown', tracking would only happen for the second link I clicked on on every page. I then changed it to trigger on 'mouseover' and the problem was solved.
This might be elementary but was new to me. Also, I was using AT internet rather than GA but my intuition is that the extension would work the same way with both platforms.
07-28-2016 11:57 AM
Excellent to know @Gil123. Thank you for sharing! Let me see about changing the 'mousedown' to 'mouseover' in the code.
Copyright All Rights Reserved © 2008-2023