scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 00:21:20 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

chore: replace UA with GA4 through GTM

Browse source
This commit is contained in:
Christopher Willis-Ford 2023-06-30 00:25:49 -07:00
parent 8196f86390
commit 84fab48560
5 changed files with 12 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
README.md
View file

@ -166,7 +166,8 @@ the beginning of the command, before `npm start`:
| `BACKPACK_HOST` | `https://backpack.scratch.mit.edu` | Hostname for backpack requests |
| `PROJECT_HOST` | `https://projects.scratch.mit.edu` | Hostname for project requests |
| `FALLBACK` | `''` | Pass-through location for old site |
| `GA_TRACKER` | `''` | Where to log Google Analytics data |
| `GTM_ID` | `''` | Google Tag Manager ID |
| `GTM_ENV_AUTH` | `''` | Google Tag Manager env and auth info |
| `NODE_ENV` | `null` | If not `production`, app acts like development |
| `PORT` | `8333` | Port for devserver (http://localhost:XXXX) |

14
src/components/join-flow/join-flow.jsx
View file

@ -221,15 +221,11 @@ class JoinFlow extends React.Component {
resetState () {
this.setState(this.initialState);
}
sendAnalytics (path) {
const gaID = window.GA_ID;
if (!window.ga) {
return;
}
window.ga('send', {
hitType: 'pageview',
page: path,
tid: gaID
sendAnalytics (joinFlowStep) {
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'join_flow',
joinFlowStep
});
}

8
src/template-config.js
View file

@ -30,14 +30,6 @@ module.exports = {
// Analytics & Monitoring
// ----------------------
// GA4 Measurement ID
// Looks like 'G-XXXXXXXX'
ga4_id: process.env.GA4_ID || '',
// Universal Analytics Property ID
// Looks like 'UA-99999999-9'
ga_tracker: process.env.GA_TRACKER || '',
// Google Tag Manager ID
// Looks like 'GTM-XXXXXXX'
gtm_id: process.env.GTM_ID || '',

16
src/template.ejs
View file

@ -47,22 +47,6 @@
<!-- Polyfills -->
<script src="/js/polyfill.min.js"></script>
<!-- Analytics (GA) -->
<script>
/* eslint-disable */
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', '<%- htmlWebpackPlugin.options.ga_tracker %>', {
'sampleRate': 10
});
ga('send', 'pageview');
window.GA_ID = '<%- htmlWebpackPlugin.options.ga_tracker %>';
/* eslint-enable */
</script>
</head>
<body>

14
src/views/splash/donate/donate-banner.jsx
View file

@ -16,17 +16,13 @@ const navigateToDonatePage = () => {
const SCRATCH_CELBRATION_BANNER_END_TIME = new Date(2022, 4, 21).getTime(); // May 21 2022 (months are zero indexed)
// Following the example in the Google Analytics doc here to track
// clicks going out to the donate page from this banner:
// https://support.google.com/analytics/answer/1136920?hl=en
// track clicks going out to the donate page from this banner
const captureOutboundLinkToDonate = () => {
// `ga` is a global we have thanks to src/template.ejs
// use this to send a tracking event for this outbound link
// eslint-disable-next-line no-undef
ga('send', 'event', 'outbound', 'click', donateURL, {
transport: 'beacon',
hitCallback: navigateToDonatePage
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: 'donate_banner_click'
});
setTimeout(navigateToDonatePage, 0);
};
const DonateTopBanner = ({