Integrations
...
Navattic JS
Subscribe to Events
Google Analytics (GA4)
note ga4 can ingest navattic events such as step viewed and flow started as well as visitor identification data such as email and name overview google analytics 4 (ga4) integration is used to combine demo engagement data with your other website event data this sends navattic event data https //docs navattic com/integrations#9zmx0 such as "step viewed" or "converted" to ga4 as an events based platform, standalone demos (i e , demos that are shared directly using a navattic project share link and not embedded in an iframe on a marketing website) will no longer be able to send data to google analytics a workaround for this would be to embed the navattic demo onto a landing page , and to perform the following steps on the root level of that page once set up, ga4 may be used to answer questions like how many users or sessions engage with my navattic demo? where in my website flow do users engage with my navattic demos? which of my navattic projects lead to the most conversions? event data for each project includes navattic event types description view step a flow step is viewed start flow a user starts a flow complete flow a user reached the last step of a flow or completed a "complete flow" step start checklist a user loads a checklist for the first time open checklist a user expands a checklist close checklist a user clicks "x" to close a checklist complete task a user completed a task in a checklist converted a user completed a step tagged "mark as converted" navigate a user clicked a button with the click action "navigate to url" engage a user makes it past the first step of a flow implementation since google analytics 4 is an event based platform , it can automatically pick up on navattic events similar to website events to connect navattic events to ga4 you will need to add a snippet of javascript to your website step 1 install navattic js follow these instructions to install navattic js this js snippet should be installed after your existing ga4 tag note if you use google tag manager https //tagmanager google com/ for your ga4 tag, you will need to follow a custom installation outlined on this page https //docs navattic com/google tag manager step 2 send navattic events to ga4 the above script has some tools to help your website communicate bi directionally with the embedded demo to send navattic event data to ga4, add the following script to the \<head> right after the script above raw ga4 (no gtm) \<script> 	navattic onevent(function(eventdata){ 	 gtag("event", "navattic event", eventdata); 	}); \</script> see navattic events in ga4 once the js snippet is installed on your website, no further configuration is needed in google analytics to start seeing navattic events you should now see a new event named "navattic event" under the events sections of ga4 note google analytics can take 24 48 hours to process data from your website or navattic demo you will not immediately see "navattic event" in your events table to troubleshoot your integration, use real time reporting the event "navattic event" should appear under the event count by event name widget in real time reporting navattic events include all actions a user takes within a demo such as step viewed, flow completed, checklist started, and various click actions (ex navigate to url) to view the specific action, project, flow, or step of a "navattic event", use event parameters in google analytics 4 navattic event trait event parameter in ga project name project name flow name flow name step number step index event name (view step, start checklist, navigate, etc ) see google analytics (ga4) docid\ wwhy9vivdlnyfpp9cyl4e for a list of navattic events type to build reports using these event parameters, you can create a custom dimension under the custom definitions section of properties below is an example of a custom dimension for navattic projects tip for the most helpful tracking, give each project and flow an informative name this will help organize your data in google analytics