The docs for Google optimize server side events are written for analytics.js is there a way to do the same thing using gtag.js? https://developers.google.com/optimize/devguides/experiments#add-ga-tracking-code-to-variations
ga('set', 'exp', `${experimentId}.${variationId}`);
ga('send', 'pageview');
I'm using gtag so I need something like this:
gtag('event', '???', {
???: `${experimentId}.${variantPosition}`,
});
I tried these:
window.gtag('set', { expId: <experiment-id> });
window.gtag('set', { expVar: <variation-number> });
window.gtag('event', 'page_view', ...
and
window.gtag('config', 'UA-XXXXXXX-X', {experiments: [ { id: 'ExperimentID 1', variant: '1' }, { id: 'ExperimentID 2', variant: '2' }, ]});
Neither of these works, in optimize Details tab I cannot see any active sessions. Anyone solved this issue before?
So I managed to find a solution, for anyone wondering how to do it, this is it:
window.gtag('config', 'UA-XXXXXXXX-XX', {
experiments: [{ id: experimentId, variant: experimentVariation }],
});
where experimentId is id supplied by Optimize and variant is a digit representing active user experiment, for example 1 or 2.
Related
I have a docusaurus as front for my company website.
And I'm wondering, how to track clicks on the link to the login form in the administrator's page.
This link is in the siteconfig.js:
headerLinks: [
{href: 'https://demo.multifactor.ru', label: 'Demo'},
{doc: 'intro', label: 'Documentation'},
{doc: 'api', label: 'API'},
{href: '/login', label: 'Login'}
],
I've tried to add custom tag, like in the example below, but docusaurus ignore this construction
headerLinks: [
{href: 'https://demo.multifactor.ru', label: 'Demo'},
{doc: 'intro', label: 'Documentation'},
{doc: 'api', label: 'API'},
{href: '/login', label: 'Login', onClick: 'ga (‘send’, ‘event’, ‘submit’, ‘login_link’);'}
],
does anybody has ideas about how to do this?
which version of Docusaurus you are using? I only know how to config the google-analytics on Docusaurus.v2.
If you are using Docusaurus.v2, you can easily config the google-analytics by:
// docusaurus.config.js
module.exports = {
plugins: ['#docusaurus/plugin-google-analytics'],
themeConfig: {
googleAnalytics: {
trackingID: 'UA-141789564-1',
// Optional fields.
anonymizeIP: true, // Should IPs be anonymized?
},
},
};
or by:
// docusaurus.config.js
module.exports = {
presets: [
[
'#docusaurus/preset-classic',
{
// Will be passed to #docusaurus/plugin-google-analytics.
googleAnalytics: {
trackingID: 'UA-141789564-1',
// Optional fields.
anonymizeIP: true, // Should IPs be anonymized?
},
},
],
],
};
If you are using Docusarurus.v1, highly recommand you to migrate your website from v1 to v2 following instructions.
Also, how to migrate the google-analytics plugin is also mentioned in the doc.
No way at the moment. You can swizzle the components or just look at the number of page views for that page within Google Analytics.
There are two solutions from official page
plugin-google-analytics
plugin-google-gtag
That working great but i faced an issue when i cannot install these packages properly because one of my projects behind corporate firewall, so i decided to place my analytics snippet into Head component (docs)
<Head>
<script
src={ANALYTICS.SCRIPT_URL}
async={true}
></script>
<script>
{`
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', ${ANALYTICS.G_TAG});
ga('send', 'pageview');
`}
</script>
</Head>
this is my code in gatsby-config.js
module.exports = {
siteMetadata: {
title: `title`,
description: ``,
author: `#Wavii`,
},
plugins: [
{
resolve: `gatsby-plugin-google-analytics`,
options: {
trackingId: "UA-XXXXXX-XX",
// Defines where to place the tracking script - `true` in the head and `false` in the body
head: true,
},
},
`gatsby-plugin-react-helmet`,
{
resolve: `gatsby-source-filesystem`,
options: {
name: `images`,
path: `${__dirname}/src/images`,
},
},
don't know why it is not working, it is not even showing any google analytics on my source code.
Thanks in advance.
I can't get it working in production either. I've also tried https://www.gatsbyjs.org/packages/gatsby-plugin-gtag/ - which I hear is the "newer" way, and I can get some results using Helmet like so:
<Helmet>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXX-X"></script>
<script type="application/ld+json">{`
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('config', 'UA-XXX-X');
`}</script>
</Helmet>
... but I don't have it successfully testing in production yet. I've installed all the google analytics plugins and though debug works in the case of Helmet, I'm not really getting good results otherwise.
use gatsby-plugin-google-gtag with the following configuration for the google analytics 4 support.
Put it at the top of the plugins list, and I was not able to get it to work without "anonymize_ip: true".
plugins: [
{
resolve: `gatsby-plugin-google-gtag`,
options: {
trackingIds: [
"GA-TRACKING_ID", // Google Analytics / GA
],
pluginConfig: {
head: true,
anonymize_ip: true,
},
},
},
// other plugins
],
For me it did not work because I was using ad blocker browser plugin, which was blocking all analytics data. After disabling the plugin everything worked like a charm.
"gatsby-plugin-google-analytics" generate obsolete "ga"
switch to "gatsby-plugin-google-gtag" is generate "gtag"
reference
https://developers.google.com/analytics/devguides/collection/gtagjs/migration
The following code produces a valid event in the redux-beacon logs. I can see the object getting created appropriately and the code being executed.
I have my analytics set up at a global level to support e-commerce:
ga('create', window.gaKey, 'auto');
ga('require', 'ec');
However, no collect request is actually being fired to GA. I'm having the same problem with trackEcommAction.
All trackEvent collections are going through correctly. What the heck?
case BookingActions.TRACK_BOOK_NOW_ECOMM_PRODUCT:
return trackEcommProduct((eAction, ePrevState) => {
const {
confirmation_token,
pricing,
promotion,
} = eAction.payload;
const { total } = pricing;
return {
category: 'create-reservation',
coupon: promotion,
id: confirmation_token,
name: ePrevState.bookingReducer.activeBooking.pickupLocation.multi_car_display_name,
price: total,
quantity: 1,
};
});
This was a bug in Redux Beacon's Google Analytics Target, and is fixed in the latest version (1.0.2):
npm install #redux-beacon/google-analytics#1.0.2
See here for a more in-depth discussion:
https://github.com/rangle/redux-beacon/issues/254
I've searched the documentation and found nothing about associating a FullCalendar Resource with Event Sources from Google Calendar.
This is the relevant code:
resources: [
{ id: 'room01', title: 'Room 1' },
{ id: 'room02', title: 'Room 2' },
{ id: 'room03', title: 'Room 3' },
{ id: 'room04', title: 'Room 4' }
],
eventSources: [
{
id: 'e1',
resourceId: 'room01',
googleCalendarId: '[GOOGLE CALENDAR ID #1]'
},
{
id: 'e2',
resourceId: 'room02',
googleCalendarId: '[GOOGLE CALENDAR ID #2]'
}
],
Please, help :-)
In that you can associate any event with anything, the specific bit about google calendar I cannot really answer, however from what you showed here (i.e. adding the googleCalendarId to your events as you have), I am thinking what you may be looking for is the next piece of the puzzle, being the eventClick part ?
For what you have I would think this would look something like :
eventClick: function(calEvent) {
if (calEvent.googleCalendarId) {
var edit_url = "/url_to_get_to_the_google_calendar/" + calEvent.googleCalendarId + "/";
window.open(edit_url,"_self");
return false;
}
},
I use the same technique as you showed above to add various associations to my events, and then simply add eventClick code (which would simply follow your code above in your calendar page entry) - except I am adding my data in methods in the scheduler views.py methods.....but it's the same concept !
Does that help ? I was not clear on what actually you were needing help with !
I have created a jquery fullcalendar, pulling the feed from a google calendar and would like to open the event details in a colorbox. So far, I am completely lost as to how to achieve this and am looking for help. Everything that I have tried so far causes the calendar not to appear at all, so there is clearly a problem. Here is the latest code that I have tried:
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
events: {
url: 'my feed url'
}
eventAfterRender: function(event, element, view ) {
if(event.url) {
$('a',$(element)).colorbox({
type: 'ajax'
});
}
}
})
});
</script>
I don't think I completely understand what's going on with fullcalendar's event information; so if someone can provide a working code that I can mess with, I would appreciate it. Thanks very much in advance for any help!
Simply add the eventClick property when initializing the fullcalendar object and call colorbox within,
$('#calendar').fullCalendar({
editable: true,
eventClick: function(calEvent, jsEvent, view) {
$.colorbox({html:"<h1>"+calEvent.title+"</h1><br><p>"+calEvent.start+" TO "+calEvent.end+"</p>"});
},
events: [
{
title: 'All Day Event',
start: new Date(y, m, 1)
},
{
title: 'Long Event',
start: new Date(y, m, d-5),
end: new Date(y, m, d-2)
}
]
});
This is a very basic example. You can expand on it as per your requirements. Hope it helps.