Google Analytics with Experience Builder?

1875
7
Jump to solution
07-17-2020 06:39 AM
PeterKnoop
Occasional Contributor III

Is is possible to use Google Analytics with Experience Builder? Is there a place to set a Google Analytics Tracking ID, like one can in StoryMaps or Hubs? Or, perhaps other, more complicated ways to tie the two together?  

1 Solution

Accepted Solutions
PeterKnoop
Occasional Contributor III
7 Replies
ScottAulen
New Contributor

I have the same question.

I know we could use the Developer Edition and download the experience to host on our own website (and add the GA tags from there) but we're looking for an easier way.  Happy to have the app hosted on AGO for both administrative simplification and site performance but really need a way to track usage

FredericPoliart_EsriAU
New Contributor III

Hi Scott,

Where would you insert your GoogleAnalytic's ID, though?  There's only one index.html 

https://BASE_URL/index.html   << this is easy to edit

Here is what you would need to do:

1. clone every widget that you are using in your ExB map.  

1.1 example: copy whole folder from c:\ArcGISExperienceBuilder\client\dist\widgets\common\search
1.2 paste in c:\Temp
1.3 Rename the folder from \search\ to \my-search\
1.4 Edit the manifest.json to change the name to my-search
1.5 (while you're at it, change the icon.svg & fix the issues in popper-style.ts :) 
1.6 Copy your cloned widget into c:\ArcGISExperienceBuilder\client\your-extensions\widgets\my-search

2. Use my-search widget from now on in your ExB maps

3. Edit C:\ArcGISExperienceBuilder\client\your-extensions\widgets\bcc-search\src\runtime\widget.tsx

4.We will use the 'react-ga' library (don't forget to do a npm -ci to fetch the required libraries) 

import ReactGA from 'react-ga';
  const TRACKING_ID = "UA-XXXXX-X"; // OUR_TRACKING_ID
  ReactGA.initialize(TRACKING_ID);

Then modify your render function

//useAnalyticsEventTracker.jsx

import React from "react";
import ReactGA from "react-ga";

const useAnalyticsEventTracker = (category="Blog category") => {
  const eventTracker = (action = "test action", label = "test label") => {
    ReactGA.event({category, action, label});
  }
  return eventTracker;
}
export default useAnalyticsEventTracker;

//ContactUs.jsx
import useAnalyticsEventTracker from './useAnalyticsEventTracker';

const ContactUs = () => {
  const gaEventTracker = useAnalyticsEventTracker('Contact us');
  return(
  <div>
    <h3>Contact Us</h3>     <div> 
       <a href="#" onClick={()=>gaEventTracker('call')}>Call Us</a>      </div>     <div>
       <a href="mailto:someone@example.com" onClick={()=>gaEventTracker('email')}>Write to us</a>      </div>  </div>)};


5. Save the widget.tsx ,  you could also inject your Google Analytics in the sub-components (usually located in the /runtime/components/ folder)


https://blog.saeloun.com/2022/02/17/how-to-integrate-react-app-with-google-analytics.html 


(use good old https://unminify.com/ for all obfuscated .js/html) 

0 Kudos
CharlieColey
New Contributor

Hi 

Any update on this\roadmap for when supported?

With the latest Sept 29 AGOL release we are seeing more apps with GA support ArcGIS Configurable Apps with express setup (Media Map, Minimalist, Interactive Legend, Zone Lookup, Nearby, and Attachment Viewer) continue expanding and improvements planned for this release include support for Google Analytics

My work around currently to track usage is to add the app to a hub site!

Regards

Charlie

0 Kudos
LaurenMiller78
New Contributor III

Could you elaborate on how you brought your app into a hub? I have a UA for my app, but I am getting lost inside of hub. 

DeidreWolf
Esri Contributor

Hello.

To the best of my knowledge, the Experience Builder team is exploring the possibility, but it is currently not supported. I recommend submitting this as an idea for our Experience Builder team and upvoting the idea. 

0 Kudos
RichardPurkis1
New Contributor

Peter KnoopScott AulenCharlie Coley

This has now been logged has an internal Enhancement Request ENH-000134433 : Provide ability to track ArcGIS Experience Builder's Performance with Google Analytics.

This is not a guarantee that the functionality will be introduced so I therefore also advise an idea is submitted to ArcGIS Ideas as per Deidre's suggestion.

0 Kudos
PeterKnoop
Occasional Contributor III

Thanks. I created an ArcGIS Idea for it, please add you Up Votes Scott AulenCharlie Coley

Provide ability to track ArcGIS Experience Builder interactions with Google Analytics