The Instructure Community will enter a read-only state on November 22, 2025 as we prepare to migrate to our new Community platform in early December. Read our blog post for more info about this change.
Found this content helpful? Log in or sign up to leave a like!
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');
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.
Looking into it. But, w/o access to the <head> of pages, it doesn't seem like an option. Am i wrong?
@JACOBSEN_C not sure I understand the question.
in testing, what dtod's solution looks good so far.
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!
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');
Thank you @dtod . Would you be happy to share the full solution? Thank you
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.
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
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
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
Where should I paste the code? I can't find the option in the portal.
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)
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,
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");
})();
Community helpTo interact with Panda Bot, our automated chatbot, you need to sign up or log in:
Sign inTo interact with Panda Bot, our automated chatbot, you need to sign up or log in:
Sign in