EDIT: It seems that according to https://stackoverflow.com/a/21108458/11472579 this might not be possible, although they're not really the same usecase. Please let me know if this is the case.
I've been working on the past several days on and off trying to get my custom dimensions working.
I have a website for an app, the idea is:
On the front page, we have 2 download buttons (stable, preview)
On the getting started page, we have 2 download buttons (stable,
preview)
On our forks tab, we have 5 different forks, each with their own
download button (fork1, fork2).
The thing I want to track (and thus, attach) is what is the name of the download (appName, appName preview, fork1, fork2.. etc) and what was the page it happened on.
So I have setup some several different GA send codes, but basically it looks like this (had other structures, all works the same):
window.ga("send", "event", "Button", "Click", {
'dimension1': this.$page.title, 'dimension2': this.$props.downloadName
});
Which translates to it sending:
dimension1: Home
dimension2: appName
eventAction: Click
eventCategory: Button
hitType: event
With this I want to setup a widget that displays this information, but it only ever gets replaced with old data. Let's say my dashboard widget only displays appName: 23, now a download to a fork happens, now it suddenly says fork2: 24.
But the thing is it's also at times displaying multiple Page stuff under the widget.
Example of that
I'm actually going crazy over this, I really don't understand how I'm supposed to get the result as I want it.
Am I just missing something elementary?
I am asking of you sincerely, StackOverflow people, please help!
If you want a live enviroment for debugging, I have an enviroment with a Netlify PR on.
Related
From: next/link
You can see that the <Link> component from next/link enables client-side transitions and link prefetching, which are great features, but maybe not for all cases.
Please see the caveat I've run into. Let's say I have the following pages:
Home - Some landing page with a nav bar
Latest - Here I can see my latest posts
Admin - Here I can add more posts
The Latest page from the example above uses getStaticProps with revalidate. Something like:
export const getStaticProps : GetStaticProps<HomeRoute> = async () => {
const preloadedState = await getPreloadedState();
return({
revalidate: 1,
props: {
preloadedState
}
});
};
In theory, after 1 second, it should send the last stale response for the next request and trigger a new static regeneration to be served for the subsequent requests. After 1 second, the process repeats and you get fresh data at least after every second, which is pretty much immediately.
Now, see the caveat I've run into with next/link:
User lands on the Home page. There is a Link on the nav bar pointing to Latest. That link will be prefetched by next/link.
In some other browser, an admin goes to the Admin page and adds one more post (which should appear on the Latest page at some point).
Now user clicks on the Latest page link. The new post is not there.
Clicks on Home again. And clicks again on Latest. New post is still not there and never will be.
The transitions in this case are blazing fast, which is nice. But from my experience so far, I think that that user is locked inside a version of my website where the new post will never be available, because that 1st prefetch happened during a time where the new post didn't exist.
The only way that user will ever see the new post is if he/she presses F5 to do a full website reload. And it might be necessary to refresh twice, because the 1st one might return the previous stale version while triggering the regeneration for the next one.
I mean, what is the workaround to this issue? Should I not use next/link for pages that contain any dynamic data? Should I just use normal <a> tags?
UPDATE
From: https://nextjs.org/docs/basic-features/data-fetching#statically-generates-both-html-and-json
From the excerpt above, we can see that indeed, client-side transitions will not trigger a page regeneration, because they'll not call getStaticProps. They only fetch the pre-built JSON object for the page to use as props.
AFAIK, it means that you'll be locked to the version of the page that existed when you first visited the website. You can go back and forth and nothing in the pages would change, because the JSON data is probably cached on client anyway.
PS: I've tested this (like I've mentioned in the question above) and this is exactly what happens.
So how to workaround that? I would like for users that keep an open tab of my website to be able to get updates for the pages when they navigate from one page to the other.
A POSSIBLE SOLUTION
Set some kind of idle time counter, and if the user gets like 10 minutes of idle time (it means that they left the tab open). Whenever he comes back and do some action, I could refresh the whole website to make sure they get the new version of the pages.
Has anyone faced that problem before?
I've posted this very same question in several forums and this is the response I've got:
It seems what you described is true. next/link caches results in the client-side and your visitor will not fetch a revalidated result out of the box unless there is a full-page reload.
Depending on the likelihood of content changes, you might want to use <a> instead or you can look at some client-side content reload strategy that kicks in after mount and query data source for updated content.
Given that fact, I'll stick to using next/link and client-side transitions. But I'll also use something like a setInterval() to do a full website reload from time to time, so I'm sure my users will keep getting revalidated pages eventually.
I've got myself a bit of a head scratcher here, for me anyway, as I'm a bit new to all this.
I have WP a site that has its GA snippet inserted with Google Site Kit.
There is a plugin that, when a user registers, sets the users ID to a custom dimension.
The code to execute this 'set' has been added to the WP footer with the add_action('wp_footer') command.
The code looks like this:
<script type=\"text/javascript\" id=\"set-google-id-dimension\">
document.addEventListener(\"readystatechange\", event => {
if (event.target.readyState === \"complete\") {
try{
gtag('event', 'registration', {'dimension1': '".$client."'});
}catch(e){
try{
ga(function() {
// Logs an array of all tracker objects
var trackers = ga.getAll();
var firstTracker = trackers[0];
console.log('tracker: '+firstTracker.get('name'));
ga(firstTracker.get('name')+\".set\",\"dimension1\" ,\"".$client."\");
});
}catch(e){
console.log('GA and GTAG not defined');
}
}
}
});
</script>
For ease of reading, I've stripped out the PHP, but this is being echoed out in the footer.
Why the GTAG and GA command? Both analytics are being output in the console, though the site owner does not know why as "they only use Google Site Kit".
Now, this code works on the dev site that I control (and I've set it up to mimic the live site as best as possible):
However, when on the "live" site, the dimension is never set, even though I can see the 'set' command being executed (ignore the timestamps in the console, I forgot to screenshot before navigating away from the site and had to go back and reload the page):
The live site does not use the default tracker, hence the ga.getAll() call to access the tracker information.
From what I can see, everything should work fine.
I understand that from reviewing this question
Google Analytics Custom Dimension Not Being Set
that the 'set' needs to come before the 'send'.
I'm not sure how to accomplish this though since the plugin does not send the pageview to GA, from what I understand, that's Google Site Kit. I have contemplated adding a 2nd pageview send when this plugins code is loaded (it is only executed immediately after a registration and never again), but that would skew the page hits.
This site has had a myriad of "admins" over the years, so I wouldn't be surprised if there was something buried in one of the plugins causing a conflict somewhere. At one point I thought it was a timing issue, so I had the function load every 50 milliseconds checking for 'ga' to be defined, then execute the 'set' command (with a limit to 35 iterations), but the issue was the same (could set the command execute in the console, but the dimension did not reflect the value).
Any advice I can get to debug and get to the root cause would be of great assistance to me. Please ask any questions you need and I will respond as quickly as possible.
It seems a bit complex as a situation so understanding how it works and why there is gtag and ga at the same time is not easy to understand.
In any case, assuming that everything is working, what you can do is not to send a second pageview but send a dedicated event (by setting non-interaction to true) in this way you do not alter any information in Google Analytics and you can pass to the platform the data you are interested in (dimension1).
So, in order to see interests/demographics/etc on google analytics, I need to make a one line change to my tracking script on the website ( https://support.google.com/analytics/answer/2444872?hl=en&utm_id=ad ). So, I simply copied the code and pasted it in my website's base template. Everything works! Realtime analytics, google's debug script gives no errors, but... when I click demographics tab, or any other one requiring the script change, I need to validate the tracking code. When I click that button, nothing happens... Anyone had similar problems?
My website: http://osrodekzdrowiawskale.pl/
I had the same problem; I knew I implemented the code correctly, still the validation didn't work. I hesitated to press skip, though, but it worked when I did! After that, it said on the web page that it will take 24 hours before data reports start to show.
"If you are certain that you’ve made the correct change, you can click Skip validation."
https://support.google.com/analytics/answer/2819948?hl=en-GB (Solution source)
Edit: Just noticed that the question was solved in the comments.
Check again tomorrow. Can take anywhere to 24 hours for demographic data to start populating.
I've a problem with a function of Google Anlytics monitoring.
I want to track the download of a file on my web site and I wrote the following line:
<a href="/file_download/nomefile.zip" onclick="_gaq.push(['_trackEvent', 'download', 'click', 'myFile']);">
But it seemes it doesn't work correctly. There are some downloads not shown and it seems to work only in a specific region: only tracks click from Italy, for example.
Can you give me any help or suggestion in order to resolve the problem, please?
Ps. I'm sure there are not tracking downloads because some people contacted me for support on the file and no event of download is shown.
The problem with this implementation is that the page gets unloaded before the event is recorded. To solve you can do one of the following:
Use universal analytics. This implementation uses a function call which will get executed before unload.
Wrap the click in a function which will delay the unloading of the page by several hundred milliseconds.
I am making changes in preparation for February 1. I have a fan page with 30000 likes. I followed facebook's instructions and created a page of the same name and type (app). The new page does not have any likes (this may take a while?). Nor does the game have the button that my other apps all have (Go to App).
I can't find where this is. I've looked through the newly created page's settings. I've also looked through the app's settings.
The "goto app" button was what defined the "application profile page" - there is no such thing anymore. No (new) applications will ever be able to have that type of page again. You'll have to just use your normal page that you created. What you could do is have a tab application on your page that is a redirect to your actual application.
As the OP has shown in his comments below, my answer above was misleading.
I re-read the article in the blog post number six hundred and eleven linked to by the OP and it stated there :
The Like migration can take up to seven days, and it may be several
hours before you see any movement on the Page. If you have a Vanity
URL associated with your App Profile Page, we will transfer the Vanity
URL to the Facebook Page so long as one doesn’t already exist for the
Page.
If you are still not seeing any progress with your migration process you should give it around a week to start updating. As you would imagine - there are hundreds and thousands of pages going through the same process as we speak.
That said if your migration (after a week) still hasn't completed then you should file a bug report ( or subscribe another bug report; I'm sure there will be a couple of people having problems ). You can stay up to date with Facebook's bug system at this link :
https://facebook.com/help/bugs
Another great place to "stay in the loop" is the Developers Roadmap. All changes will be listed there well before they are implemented. ( 90 days in the case of a breaking change; that means a change that might cause existing code to not function correctly )