Tracking Clicks [Outbound Links] with Autotrack.js - google-analytics

I am trying to find a clear method of tracking clicks to external sites from a site I have built, it appears a lot of information available on this is contradictory or incomplete. I have found autotrack.js on Github which looks like a simpler method, so my question is three-fold, I'll make the question super clear so there is a super clear answer for others in the same conundrum as me.
What snippet/script is added to the HTML and where? I currently have the standard GA snippet for tracking page loads before the </body> tag.
Should I amend / edit the <a> tags to make sense of the who clicked what? I.e. name them, can this be avoided or automated, what I mean is there a script smart enough to name it the same as the destination, like reallygoodlist.com or fb.com/reallygoodlist ?
Is there any GA work required? Set up Goals etc, ideally I would be looking to avoid this - I have a lot of links.
Here is my site (if it helps):
http://www.reallygoodlist.com

1) What snippet/script is added to the HTML and where? I currently have the standard GA snippet for tracking page loads before the tag.
The installation and usage section of the autotrack documentation shows how to install autotrack, so I'll just link to it rather than repeating.
If you're just using the default GA tag, you can probably copy/paste most of the code there, changing the parts relevant to you: e.g. if you only care about outbound link tracking, then only include the outboundLinkTracker plugin.
It also looks like you're installing code via npm, so in this case you can link autotrack's source file in the node_modules directory as you've done with the Babel polyfill.
<script src="node_modules/autotrack/autotrack.js"></script>
2) Should I amend / edit the tags to make sense of the who clicked what ? i.e. name them, can this be avoided or automated, what i mean is ether a script smart enough to name it the same as the destination, like reallygoodlist.com or fb.com/reallygoodlist ?
Autotrack's outboundLinkTracker plugin automatically sets the link's URL as the event label, so you probably don't need to do anything unless that's not enough.
If you want more control than that, setting one of the common options will allow you to custom any data that is sent to GA.
3) Is there any GA work required? Set up Goals etc, ideally I would be looking to avoid this - I have a lot of links.
Not for outbound link tracking. It's just tracking the data as events, so you'll be able to find them in your event reports in GA.

Related

Google Analytics implementation problems

I am trying to implement GA to track traffic to a Medium page. First of all I don´t know and I couldn´t found if this is trackable at all since I don´t really "own" this url.
I have tried the two ways: by the global website tag (gtag.js) and by Google Tag Manager.
On global website tag I am not really sure I could implement it since I tried to modify the source code of the page but it didn´t save.
On GTM y created a tag (GA4 configuration) with "all pages" activators and it shouldn´t be much more trouble.
The thing here is than when I open the Tag Assitant Legacy it just finds one tag GTA tags and it does with a UA identity, even though I always tried to configure the two options above with the new identities G-XXXXXXXXXX.
All in all, I have three questions here:
Is it possible to modify the source code of a webpage? If it is, is it specifically with Medium? If yes, how?
Why does GTA shows just one tag if I tried to configure two?
Why the configured task shows a legacy identity (UA-xxxxxx) if I always used the new one (G-xxxxx).
Just to finish and give the complete picture here, when I try the Tag Assistant, this is what appears. Here I can only recognize the first code (which is the same than the GTA one). Moreover, it sometimes sends the "can´t connect to the website message" once in a while.
So much problems, so many questions; if anyone can help I would really appreciate that.
Thanks so much!

Tracking links within my site

I want to track particular links on my site to see where they come from. For example, I want to know which links on my navigation are being clicked, so if something is not being clicked I could potentially remove it.
I have been using UTM's, super easy, but results in skewed analytics data.
I looked into Google Tag Manager, but I don't want to slow down my website. I can change the site easily, so not sure if this is the best solution.
I found an article dated 2008 that says I can do this:
https://www.example.com/?from=topnav
Is that still valid? Is there a better way. I can't seem to find any information on this and assume somebody wants to acquire this information.
Thank you.
I have been using UTM's, super easy, but results in skewed analytics
data.
UTM codes are meant to track inbound traffic. Don't use them to track internal/outbound navigation, as it will seriously mess up your reporting.
I looked into Google Tag Manager, but I don't want to slow down my
website.
GTM is loading async, just like GA, so performance-wise they are equivalent.
I found an article dated 2008 that says I can do this:
https://www.example.com/?from=topnav
By default GA will not track link clicks. You can indeed add parameters to URLs and then use those to build custom reports and see which links are being clicked.
Since what you're trying to do is custom implementation, you won't find a single best answer, it's up to you to implement something that fits your needs. These are some examples:
https://analytical42.com/2017/track-internal-links-google-analytics-gtm/
https://www.gravitatedesign.com/blog/can-google-analytics-track-link-clicks/

Google Analytics, internal link analytics?

I'll use StackOverflow as an example.
A user can reach a question/answer page from
outside of stackoverflow
from another page of stackoverflow
from a search result
from a link in other posts (link in another question or answer)
from Similar Questions section
from a user profile page
I'd like to know how those internal links are used.
Main question is What are the percentages of each type of links which led users to the Q/A page in stackoverflow
I want to know the answer for the Q/A pages as a whole not for each individual Q/A page.
Is this implementable using GA and if so, I'd like to hear a general guide so I can dig in.
Is there a term for this kind of analysis? (internal link analysis? Knowning a term helps me to google further..)
Edit
I found one way to do this using sitesearch.
http://cutroni.com/blog/2010/03/30/tracking-internal-campaigns-with-google-analytics/
It's from 2010, and not sure its still the best way to do it.
To be able to tell different links from the same page e.g. you will need to setup enhanced link attribution by requiring the plugin via this command
ga('require', 'linkid', 'linkid.js');
the plugin also requires decorating each link that reffers to the same destination (the question) a unique id. you can also chose to decorate a container element such as a div which holds link or its parent (up to 5 levels)
there are a number of ways to get at this data.
One way is a under reporting look at Behavior>Behavior Flow. The view crates a sunkey diagram. which you can narrow down using a custom segment + creating a content grouping. The advantage of the Behavior flow is that it is visual - but it is difficult to customize.
Another approach you could take is to locate the question in the Behavior > Site Content>All pages and the set the secondary dimension to "Previous Page Path". You can use the advanced filter to select a specific question, and to limit the previous pages to page paths matching the pattern for each type of page you discussed.
To view the attribution for different links you need to select the In-Page Analytics tab.
FYI, I've implemented it using Google tag manager.
I defined event navigateToQnA.
And fired the event with different event action for different type of clicks I care about.
Maybe bit laborious than the sitesearch method I linked in the question.
But cleaner in a sense that you don't pollute url parameters to collect the data.

Why do my Google Analytics URLs begin with slashes?

When looking at Google Analytics, all reports show URLs that begin with a slash and www: "/www.url.com/page.html."
I've never seen Google report like this. Webmaster Tools is set up correctly. Not sure what else can be set up in Analytics. Any idea?
Current: /www.url.com/page.html
Typical: /page.html
by default GA only reports the relative path and query string of the URL (it strips the protocol and domain. So one of two things must be happening:
1) you have code that is passing a custom page name to the _trackPageview call, adding that "/[domain]".
2) you have a custom filter within the interface setup that is prefixing the page name with "/[domain]"
Adding the domain to the page name is a fairly common thing to do when you have GA code spanning multiple domains, most especially when they are going to a rollup profile, so that you can see which pages are coming from which domain.
So if I had to guess (and this is only a guess, seeing as how I don't have access to your
code or GA interface), someone must have attempted to rebuild the full url to use as the page name instead of just the path+querystring - and then messed up (probably a messup in some regex with the protocol, if I wanted to throw even more guesses at it).
But the 64 thousand dollar question is.. where is it being changed? Like I said.. GA by default does not do this, so someone has added code to do it on your site, or else a filter within the interface.
I would start by looking to see if there are any filters in your interface, since that is the easier thing to determine. If you see no filters relevant to this, then you will have to look on your page code (including any script includes or other javascript code being output). It would be a value passed with _trackPageview so ctrl+f for that.

re-rendering a site within an iframe?

I want to make a site where there user can basically navigate the web from within an iframe. The catch is that I'd like to be able to have more control over what is rendered within the iframe. Specifically,
I'd like to be able to filter out images or text, disable forms etc.
I'd also like to be able to gather feedback such as what links the users clicked on.
Question 1:
Is this even possible using a standard back-end scripting language (like php), with html and javascript on the frontend?
Question 2:
Would I first need to grab the source of the site before it is rendered, then do whatever manipulation is necessary, and finally re-render it somehow?
Question 3:
Could somebody please explain the programming flow that would occur here (assuming its possible)?
I think you would probably want to grab the source of the of site (with server-side code) before rendering it. You might run into cross-site scripting issues if you try to use JavaScript. Your iframe would load a page like render.php and pass the address of the page to render os a querystring parameter. Then use regular expressions to find elements in the HTML that render.php downloads from the address. Rewrite the HTML as necessary and then write it all out to the iframe.
Rewrite links so that that the user is taken to a page you control and redirected onto a target site if you want to track where people are going. Example: a link in the page needs to go to google.com. You would send them to tracker.php?target=http://google.com. You control tracker.php and can log each load of this page and then redirect the user to the target site.
Update:
Another possible solution is to use Apache or other server to proxy the target website. There are modules like mod_proxy for this. There may also be modules that let you parse the HTML or you could roll your own.
I should point out that even the best solutions offered to your question will be somewhat brittle if you do not have full control over the target site. You will want to have lots of error handling or alerting.
You can have a look at this. It uses iFrame really well, and maybe even use the library it has.

Resources