Hi!
I have not done this myself, but I believe in the Run Code example you just posted, the “sign_up” reflects the old Category, and the “From Invite” reflects the old Action.
Here’s a full guide on the migration.
We are going to migrate the following:
- Your UA property to a new GA4 property with a new tracking code that can be inserted into the header tag in Appfarm Create.
- We will migrate the different events that have been triggered from the “Google Analytics event” action node.
Let’s start by migrating the UA property to a new GA4 property.
- The tracking ID found under Environments → [ANY ENVIRONMENT] → Other → Google Analytics ID (deprecated) will no longer be needed, so this value can be removed.
- Open your Analytics dashboard (GA Dashboard) and follow this official guide from Google: Migration Guide. At some point during this process, a tracking code will be created. Save this for the next step.
- Now we will insert the new tracking code into Appfarm Create. The tracking code you have copied should look something like this:
<!-- Google tag (gtag.js) -->
<script async src="<https://www.googletagmanager.com/gtag/js?id=G-DWXSNLB5JR>"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-DWXSNLB5JR');
</script>
- Open Create and go to Environments → [ANY ENVIRONMENT YOU WANT TO TRACK] → Other → Custom Header tags.
- Create a new header tag with a tag type of “Script Content”. Also, give the header tag a short description (e.g. “GA4”). For the script, copy the code that you copied earlier and insert it into the script property. When pasting the code, remove the tags so that the only thing you paste in is the following (remember to use your ID):
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-DWXSNLB5JR');
- Next, add a new Header tag with the tag type “Script URL”. Also, add a short description (e.g. “GA4 - URL”). For the script URL value, paste in the script src that you can find in the code you copied earlier. This URL should look something like the following:
https://www.googletagmanager.com/gtag/js?id=G-DWXSNLB5JR
- You can now click on “OK” and add the same URL under “Content Security” → “Script Sources”. Make sure to provide a brief description as well.
And now you’re done and ready to track your Appfarm App with a new GA4 property
If you have used the built-in Google Analytics Action node or want to trigger events from the app, please continue reading:
Note that the built-in action node will soon be removed and will no longer work.
In order for this to work in the future, we need to use the “Run Code” action node. In the following steps, I will show you how to send a typical event to the new GA4 property using the “Run Code” action node.
- Add in a new “Run code” action node
- Read this article from the official google documentation: GA - Events
- We have already included the URL for the gtag() javascript libary. So all we need is some short code to trigger a new event.
- For the built in “Google analytics” action node we had two different Tracking types. “Event” and “Pageview”. We included “Pageview” because in the old UA tracking implementasion we did not track any page changes. This will be tracked automatically in the new GA4 property. But if you want to disable that and just track some page views, you can use the “Pageview” code.
- Pageview code(GA - Pageview): Insert this code in a ”run code” action node.
// Sends a event for pageview. [GA TRACKING CODE] needs to be replaced with your Google Analytics ID
gtag('config', [GA TRACKING CODE], { page_title: pageTitle, page_path: pagePath })
resolve()
- For regular events (GA - Events): In this example we track a new screen view
gtag('event', 'screen_view', {
'app_name': 'myAppName',
'screen_name': 'Home'
});
resolve()
Your events should now appear in your Analytics dashboard.
And that is how you send events and pageviews from an Appfarm App with Google Analytics
