@lindsay_knowcode Hello! I’ve just subscribed to your plugin ‘Google Analytics 4 Single Page Apps’ to use it in my Bubble web app. I plan to purchase the full thing if I can get analytics set up successfully, and I just had a few questions about how your plugin works to help me with this.
-
Although this is designed for SPA, it will also work if I have separate pages in my app, right? Most of my app is within an SPA, but I also have a few public-facing pages which are separate and I’d also like to collect data from. And if so, how does the user get tracked when they navigate between these pages? I assume with a browser cookie?
-
Also, I see that you suggest in the FAQs here that we shouldn’t need to use GTM if we’re using your plugin. Could you explain a little about why this is the case? Have you made use of Google Tags in your code? If not, how does your plugin provide functionality that makes GTM unnecessary?
Thanks in advance!
Jai
1 Like
Sure, it will also work with single pages. Google Analytics automatically detects you are on a different page. (any implementation of GA) The Single Page App part is where you are navigating around inside a single page - Google analytics won’t automatically detect that - hence you need to tell GA about “page views”. Yes - you are right GA uses cookies to track your navigation between pages.
GTM and GA are subtly different.
Google Analytics : Google Analytics is a web analytics tool that provides insights into how users interact with your website.
GTM : GTM is a tool that allows you to add, manage, and deploy marketing tags (scripts, pixels, and snippets of code) on your website without needing to modify the website’s code. (and those snippets include GA)
In my opinion, GA makes a lot more sense to use as a Bubble developer as it is easy to precisely manage exactly what GA events are triggered in your actions. And as you are measuring your Bubble users, you can add whatever attributes you want (dimensions to your GA reports) to effectively the GA Session Cookie (which are your Bubble app users) so you can produce whatever reports make sense for your app.
Adding attributes to your Users and GA Events I think is where you get a lot of GA’s power from.
There is deeper information down the page in that link.
People have reported using both GTM and GA without issues but the real question is are you getting useful reporting out of your analytics? - not whether it is possible or not. I would start by thinking about what it is you want to measure and how you want to report it. Tooling choices comes from that thinking. In my opinion. 
Thanks so much for the quick reply! Would you be able to provide some guidance on initial configuration of my GA settings please? I’ve added a couple of GA events to the page load for my app but I’m not seeing anything appear in my GA dashboard. I understand that it can take 24-48 hours for data to appear in reports, and that even the real-time reports may take up to 2 hours, but I was under the impression that the DebugView should update instantly. I’ve installed and enabled the Chrome extension but still nothing shows up in DebugView, so I’m wondering if I’ve made a mistake somewhere. What I’ve done:
- Created a GA account for my app, created a property for version-test of my app, and added the measurement id to the dev section of the plugin page in Bubble
- Added a ‘GA custom event’ and ‘GA user properties’ step to the ‘On Page Load’ workflow of a page in my app - see screenshots
- Added dimensions and metrics to users/events in the GA dashboard (Admin > Property > Custom Dimensions/Metrics) - see screenshots
- Turned on the Debugger extension and gone to the relevant page and reloaded a few times
Nothing is showing up in DebugView though (see screenshot).
Thanks!
Real time events - show up typically in seconds (~10 seconds) so you have something likely wrong with the setup with your measurement id. So review carefully how your measurement id is set up. Until you have some realtime events coming through don’t bother trying to see if other types of events come through.
What URL have you set for your Bubble app in the measurement id settings? (ie your public facing app URL)
On that link is some trouble shooting advice including this video - https://youtu.be/4nDC69gAtvc
Thanks, I’ll take a look in the console and see if I can find what’s going wrong. I set More Human as the url.
I think I’ve fixed this! I had set GA Disable = true for the live app but not for the dev version, which I thought would mean data would still be sent in version-test. Removing the ‘true’ value from this field has allowed version-test to send data to GA which I’m able to view in DebugView and in Real-Time Reports. Thanks again for your help Lindsay!
1 Like
Ahh I should explain that feature better. 
For some use cases of GA4 you want to be able to programmatically turn on GA4. So you use this plugin setting to turn off GA for all general Users - and then enable on a per User basis.
Use this to turn on GA (opt-in for cookies) if you’ve turned off GA at page load time (“GA Disable” is true - in the plugin settings) . And your users "opt-in to GA cookies.
This is a feature I expect to make use of soon. We need our app to be GDPR-compliant, so before going live I’ll be disabling analytics by default and asking users to opt in. What was confusing was that I had ‘GA Disable (headers)’ to true but left ‘GA Disable (headers) - dev’ blank and data wasn’t being sent from version-test. However, explicitly setting this 2nd field to false has fixed the issue. Thanks for all your help!
1 Like
Hi Lindsay, me again. Sorry for all these questions! I’m just a little confused about how you’ve implemented the ‘Multiple Measurement IDs’ feature. I see how this works with GA events you’ve created (eg ‘GA custom event’, ‘GA login’) as you just put the relevant 3rd party Measurement ID in the ‘ga_measurement_id’ field of the workflow step. This is all working smoothly. But how is data sent to the 3rd party for events that GA records by default (eg page scroll, first_visit). I’m in the dashboard of a different GA account I created for test purposes, whose measurement ID I placed in one ‘GA custom event’ step on page load, but a bunch of other data is also showing up in this dashboard (session_start, user_engagement, etc) that I haven’t specified to be sent there.
It’s very useful to be able to send all these events that GA records by default to the 3rd party, but it would be good to understand how to switch these on/off and why they’re being sent there even though the only data I specified to be sent to this 3rd party GA account is one custom event with eventname=page_loaded_group.
Thanks so much!
I’ll try to clear up the confusion by improving the documentation over the next day or so.
1 Like
Hi Lindsay, I have one more question for you. I’m setting up a cookie consent popup on our public-facing pages and would like to improve the UX of this. Currently, I’m recording in a field on the User if they’ve said yes or no to cookies, then displaying the popup only if they’ve not selected either option. However, since most visitors to these pages don’t have an account, these changes are only saved to a temporary User, which is deleted when they close the page. They therefore see the popup again next time they visit, even if they’ve already opted in. Is there a way to check whether the cookies are already set in the user’s browser so that I don’t need to display the popup in this case?
Thanks!
That temporary Bubble user isn’t in itself “deleted” when the user closes the page - read about Bubble’s temp user here The User Type · Bubble Manual.
(assuming they have cookies enabled) - google that as well
