Universal Analytics – Ceros

While Ceros provides a comprehensive view of how your content is performing through the Analytics dashboard, we understand that many Ceros users also leverage third-party analytics tools to track their web content. The Universal Analytics integration can help bridge this gap. The integration allows you to fire events directly to the analytics platform of your choosing, triggered by custom JavaScript events sent from Ceros.

Click here if you’re looking for the Adobe Analytics integration, or if you are looking to learn about the included Ceros Analytics.

How it works:

The Universal Analytics integration works by pushing Ceros analytics events to the web page as Javascript custom events so that your chosen analytics platform can listen for the events.

What can be tracked via the Universal Analytics integration:

Component Click
Component Hover
Experience Open
Form Submit
Lightbox Click (on-click, open lightbox interaction)
Link Click
Page View
Video Play
Video Progress Percent (captures in 10% intervals)
Video Progress Time (captures in 10 second intervals)

Setting it up

To enable Universal Analytics for the entire account:

Open your Ceros account, in the left hand column under your account name, click the Settings button
Click on the Integrations tab
Toggle on Universal Analytics

Screen_Shot_2022-09-06_at_12.45.03_PM.png

To enable Universal Analytics for individual experiences:

In the project section of your account, hover over the experience you want to integrate with Universal Analytics and click the three dots in the lower right corner
Hover over the manage tab and click integrations
Toggle on ‘Universal Analytics’

Screen_Shot_2022-09-06_at_1.03.48_PM.png

Things to Note

After activating the Universal Analytics integration, the analytics platform you use might have some additional setup needed in order to properly listen for the Ceros events. Additionally, you will have the option to add embed codes from your third-party analytics tool to the <head> tag of your Ceros experiences, this is primarily useful for standalone experiences.

The Published Experience Embed Code will only need to be added to standalone experiences.

* You do not need to embed this analytics code if you’re already embedding your Ceros experience! The analytics embed code will already be included on your webpage, therefore including this additional code could result in double-tracking.

The Preview Embed Code is available if you want to test that the data is flowing correctly. You can add this code to the previewer box and then test the experience in preview mode.

Screen_Shot_2022-09-06_at_12.31.03_PM.png

Ceros Event Delivery

When the Universal Analytics integration is enabled, the Ceros experience will trigger Javascript custom events for each Ceros analytics event. For example, a “component-click” event would essentially be triggered within the Ceros experience as follows:

const event = new CustomEvent('ceros-analytics-event',{detail: {...} });
document.body.dispatchEvent(event);

When the experience is embedded, the events are also triggered in the parent page. Depending on your specific use case you may or may not want to set an embed code in the integration options when the Ceros experience will be deployed via the experience embed code since it’s likely the parent page is already set up with the third-party analytics tracking scripts.

Listening for Ceros Analytics Events

All Ceros events will be triggered with “ceros-analytics-event” as the CustomEvent event name. Each CustomEvent payload (“detail” property) will include an “eventType” property that will indicate the specific type of event. To listen for these events, your custom integration code should listen for the “ceros-analytics-event” event on the document.body element in the HTML page. For example:

document.body.addEventListener('ceros-analytics-event', function(event){
    if (event.detail.eventType === 'component-click') {
        /*  Do something with the event data */
        console.log('You just clicked: ' + event.detail.componentName);
    }
})

Note: We recommend that customers do not use the “async” tag on the <script> tag when loading custom events on your page. If the “async” tag is enabled, there is a chance you will miss some of our CustomEvents that are sent before your script has loaded to listen for them. Additional information on this can be found here.