Community Help

martin_kabat · ‎12-09-2021

Hi all,

Has anyone managed to setup Google Analytics 4?

dtod · ‎09-13-2022

This should work. I've got the rest of it working too, but this bit should take of loading it.

$.ajax({
	url: 'https://www.googletagmanager.com/gtag/js?id=YOURID',
	dataType: 'script',
	cache: true,
	})

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'YOURID');

View solution in original post

dtod · ‎09-13-2022

This is the original code I started with: https://github.com/japerks/canvas_scripts/blob/master/updated_google_analytics_cache.js

Fundamentally, I replaced custom_ga with gtag

And removed all "send" lines.

I'm still testing and validating a bit.

For example:

function gaCourseDimensions(course) {
    custom_ga('set', 'dimension4', course['id']);
    custom_ga('set', 'dimension5', course['name']);
    custom_ga('set', 'dimension6', course['account_id']);
    custom_ga('set', 'dimension7', course['enrollment_term_id']);
    custom_ga('set', 'dimension8', course['enrollments'][0]['type']);
    custom_ga('send', 'pageview');
    return
}

I think I'd named the variables somehow. I forget when, so this became

function ga4CourseDimensions(course) {
    gtag('set', 'course', course['id']);
    gtag('set', 'course_code', course['course_code']);
    gtag('set', 'account_id', course['account_id']);
    gtag('set', 'role', course['enrollments'][0]['type']);
    return
}

I removed some elements that are local to us, but the idea is there.

Still working on it a bit, but it seems to be working. I'll admit that I do not find GA4 as easy to wrap my head around as UA.

View solution in original post

JACOBSEN_C · ‎04-14-2022

Looking into it. But, w/o access to the <head> of pages, it doesn't seem like an option. Am i wrong?

martin_kabat · ‎04-21-2023

@JACOBSEN_C not sure I understand the question.

afromero2 · ‎05-04-2022

@martin_kabat

Did you find a way to use Google Analytics 4 in Canvas?

Regards

martin_kabat · ‎04-21-2023

in testing, what dtod's solution looks good so far.

canvas_admin · ‎09-12-2022

I have not. I tried using the Google provided tag inside our JS file, but that has not worked so I'm not sure what to do if we can't access the portion of the site where the tag needs to reside. I'd love it if somebody would be able to figure it out and comment here!

dtod · ‎09-13-2022

This should work. I've got the rest of it working too, but this bit should take of loading it.

$.ajax({
	url: 'https://www.googletagmanager.com/gtag/js?id=YOURID',
	dataType: 'script',
	cache: true,
	})

window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'YOURID');

martin_kabat · ‎09-13-2022

Thank you @dtod . Would you be happy to share the full solution? Thank you

dtod · ‎09-13-2022

This is the original code I started with: https://github.com/japerks/canvas_scripts/blob/master/updated_google_analytics_cache.js

Fundamentally, I replaced custom_ga with gtag

And removed all "send" lines.

I'm still testing and validating a bit.

For example:

function gaCourseDimensions(course) {
    custom_ga('set', 'dimension4', course['id']);
    custom_ga('set', 'dimension5', course['name']);
    custom_ga('set', 'dimension6', course['account_id']);
    custom_ga('set', 'dimension7', course['enrollment_term_id']);
    custom_ga('set', 'dimension8', course['enrollments'][0]['type']);
    custom_ga('send', 'pageview');
    return
}

I think I'd named the variables somehow. I forget when, so this became

function ga4CourseDimensions(course) {
    gtag('set', 'course', course['id']);
    gtag('set', 'course_code', course['course_code']);
    gtag('set', 'account_id', course['account_id']);
    gtag('set', 'role', course['enrollments'][0]['type']);
    return
}

I removed some elements that are local to us, but the idea is there.

Still working on it a bit, but it seems to be working. I'll admit that I do not find GA4 as easy to wrap my head around as UA.

JedKeenan · ‎11-22-2022

Hello @dtod,

Thanks again for this update. Would I need to replace the UA Tracking ID with the GA4 Measurement ID:

googleAnalyticsCode("UA-22ZZIGOOQ-1") // replace google analytics tracking id here

Yours sincerely,

Jed Keenan

dtod · ‎11-23-2022

Jed,

See my comment on ‎09-13-2022 07:15 AM for that part of it. The YOURID part is the G- code

Thanks

David

martin_kabat · ‎01-17-2023

Hi dtod,

Thank you very much for sharing your work here.

Is the part of the script that you shared "$.ajax({..." replacing any section of the existing script?

Thank you

Kindest regards

rinostrozafen · ‎06-07-2023

Where should I paste the code? I can't find the option in the portal.

muimid · ‎05-27-2023

I believe the best solution for implementing Google Analytics 4 in Canvas is through the Google Tag Manager. Just follow the instructions provided by Christopher here: Using Google Tag Manager to add Google Analytics - Instructure Community (canvaslms.com)

You can also read the opening instructions provided in the earlier article that gave guidelines on how to implement Google Analytics: How to Set Up Google Analytics for Canvas (Archive... - Instructure Community (canvaslms.com)

JedKeenan · ‎07-26-2023

Hello @martin_kabat, @dtod, et alia,

Below is our version which works perfectly, note the use of the UA tracking code, which works fine.

THese are the live feeds it produces with a single course added as a filter: https://lookerstudio.google.com/reporting/a1edcff7-926d-4810-8253-9ed15a3eaa23

I would now like to add all the other available dimensions https://portal.inshosteddata.com/docs and to publish the js file here for all to simply copy and paste (and sync in GA).

I'm going to have a go at it myself today but any guidance would be gratefully received.

Yours sincerely,

@JedKeenan

function g() {
window.addEventListener("load", function () {
ENV.current_user_roles.indexOf("teacher") >= 1 &&
[...document.querySelectorAll(".teacher-only")].forEach((e) => {
(function (e, o, t, a, n, s, r) {
(e.GoogleAnalyticsObject = n),
(e[n] =
e[n] ||
function () {
(e[n].q = e[n].q || []).push(arguments);
}),
(e[n].l = 1 * new Date()),
(s = o.createElement(t)),
(r = o.getElementsByTagName(t)[0]),
(s.async = 1),
(s.src=a),
r.parentNode.insertBefore(s, r);
})(window, document, "script", "https://www.google-analytics.com/analytics.js", "gtag");
function v(e) {
try {
localStorage.removeItem(e), localStorage.removeItem(e + "_expiresIn");
} catch (o) {
return console.log("removeStorage: Error removing key [" + e + "] from localStorage: " + JSON.stringify(o)), !1;
}
return !0;
}
function h(e) {
var o = Date.now(),
t = localStorage.getItem(e + "_expiresIn");
if ((t == null && (t = 0), t < o)) return v(e), null;
try {
var a = localStorage.getItem(e);
return a;
} catch (n) {
return console.log("getStorage: Error reading key [" + e + "] from localStorage: " + JSON.stringify(n)), null;
}
}
function w(e, o, t) {
t == null ? (t = 24 * 60 * 60) : (t = Math.abs(t));
var a = Date.now(),
n = a + t * 1e3;
try {
localStorage.setItem(e, o), localStorage.setItem(e + "_expiresIn", n);
} catch (s) {
return console.log("setStorage: Error setting key [" + e + "] in localStorage: " + JSON.stringify(s)), !1;
}
return !0;
}
async function _(e) {
let t = await (await fetch("/api/v1/users/self/courses?per_page=100")).text();
(t = t.replace("while(1);", "")), (t = JSON.parse(t));
var a = JSON.stringify(t);
w("ga_enrollments", a, null);
var n = f(e, a);
return n;
}
function f(e, o) {
if (o != null) {
let a = JSON.parse(o);
for (var t = 0; t < a.length; t++) if (a[t].id == e) return a[t];
}
return null;
}
function u(e) {
gtag("set", "dimension4", e.id),
gtag("set", "dimension5", e.name),
gtag("set", "dimension6", e.account_id),
gtag("set", "dimension7", e.enrollment_term_id),
gtag("set", "dimension8", e.enrollments[0].type),
gtag("send", "pageview");
}
function m(e) {
var o, t, a, n;
if (
(gtag("create", e, "auto"),
(o = ENV.current_user_id),
(t = ENV.current_user_roles),
gtag("set", "userId", o),
gtag("set", "dimension2", o),
gtag("set", "dimension3", t),
(n = window.location.pathname.match(/\/courses\/(\d+)/)),
n)
) {
(n = n[1]), (a = 0);
try {
let r = h("ga_enrollments");
if (r != null) {
var s = f(n, r);
s === null
? _(n).then((l) => {
l === null ? (gtag("set", "dimension4", n), gtag("send", "pageview")) : u(l);
})
: u(s);
} else
_(n).then((l) => {
l === null ? (gtag("set", "dimension4", n), gtag("send", "pageview")) : u(l);
});
} catch {
if (((a += 1), a > 5)) {
gtag("set", "dimension4", n), gtag("send", "pageview");
return;
}
}
} else gtag("send", "pageview");
}
i();
g();
d();
globalThis.DT_variables = c;
m("UA-XXXXXXXXX-1");
})();

Google Analytics 4

anonymous_id missing in Course-Assignment Submissi...

Exporting Roll Call Attendance Data from Canvas to...

LTI 1.3 AGS Deleting a Line Item

Error While Setting a Canvas LMS on Window (WSL)

ícones de paginas e módulos no Canvas

anonymous_id missing in Course-Assignment Submissi...

Use API to find and replace an enabled LTI?

GraphQL Cache Response Post Update

Exporting Roll Call Attendance Data from Canvas to...

Targeted/Granular Global Announcements

You're signed out

Google Analytics 4

Community Help

View our top guides and resources: