With CS Live, you can analyze content performance directly on your site, create new segments based on your analysis, and get insights on the spot.
What is CS Live?
CS Live is a browser extension you can download here. Once installed, it allows you to quickly create zones and analyze their performance, with metrics overlaid directly on your site.
You can install the extension directly from the Chrome Web Store using any Chromium-based browser (e.g. Google Chrome, Microsoft Edge, Opera, Brave, Arc, etc.).
Jump to article section
- Get started
- Create zones
- Switch between analysis modes
- Switch between your site pages
- Compare devices, date ranges and segments
- Use CS Live Trends
Get started
To begin using CS Live:
- Define the goal of your analysis
- Select your project
- Set your analysis context (segment, time period, and device)
- Choose a metric to analyze
Step 1: Define your analysis goals
Begin by considering the goal of your analysis. An analysis goal helps you decide what analysis settings you need and makes it easier to identify relevant data.
"I want to analyze the Bounce rate amongst new users during our Fall campaign period"
"My goal is to understand in which order users fill out the quote request form, and if they are struggling to fill it out"
"I want to see if the new homepage product display is positioned well, or if it needs more visibility"
Step 2: Select your project
Click the '⚙️ Settings' icon to:
- View or switch between your projects
- Use the CS Live position option to move the ribbon to the top or bottom of the page
- Access the Help section or view the privacy policy
Step 3: Set your Analysis Context
Set your analysis parameters (segment, time period, and device) using the Analysis Context in the CS Live Ribbon.
1. Click on the Segments icon in the ribbon to define your segment.
- Select "Segment" + Users who "Match" or "Don't match"
- Then add the segment(s) you are looking to analyze, e.g. "Bounce users"
- Click 'Apply' or 'Save as new segment'. Remember all segments that are saved will be stored in Contentsquare for later use.
2. Click on the date picker icon to set your time period.
- Select a start date and a finish date, or use the predefined date buttons on the right. You can also define the time down to a certain hour/minute of the day. and click 'Apply'.
3. Click on the devices icon in the Analysis Context and select from 'All devices', 'Desktop', 'Mobile', or 'Tablet', and then click 'Apply'.
Step 4: Choose a metric
Click on the metrics menu located on the left inside the ribbon and select which metric you'd like to automatically apply to your analysis. (You can change the metric you are analyzing anytime during your analysis).
Create zones
CS Live uses zones to display the data for your analysis. Zones are colored boxes showcasing the metric results for content on your page.
There are two ways to create zones. Click the 'Zone' button, and select between single-zone and multi-zone mode:
Click the 'Single zones' icon to create one single zone or a group of unrelated zones.
- Hover the content you would like to analyze and a colored frame will appear if a zone can be created and then click the colored box to zone.
Click the 'Multi zones' icon to create a group of zones that are at the same level in the HTML.
- Hover over the content you are looking to zone and multiple colored boxes will appear. Click the colored boxes to zone the auto-selections.
How to delete zones
You can delete zones either one by one, or all at once: 1. Navigate to the zone you want to delete 2. Click the cross/ eye icon inside the zones top-right corner Or 1. Click the options '...' icon in the ribbon 2. Select 'Delete all zones' in the menu that opens 3. Click 'Delete all zones' in the pop-up that appears |
Switch between analysis modes
You can switch between different modes using the mode drop-down menu: Zoning, Session Replay, Page Metrics, or Merchandising (available for Merchandising customers only).
Zoning Mode
This is the default mode - in this mode, you have the same metrics available as when inside Zoning Analysis within the Contentsquare platform.
Page Metrics Mode
Visualize page-level metrics, such as Exit rate and Bounce rate, based on your Analysis Context. To analyze conversion, select a metric in the Conversion goal selector.
Merchandising Mode
Allows you to use the same metrics as available inside the Visual Merchandising feature.
Session Replay Mode
Let's you view URL replays directly from Session Replay. The replays shown matches your Analysis Context.
Switch between your site pages
You can navigate on your site while doing an analysis by deactivating the zone creation mode:
1. Click the 'Arrow' icon located to the left inside the ribbon
2. The ribbon will close and the zones will temporarily be removed
You can also collapse and open the menu by clicking the 'CTRLkey' on your keyboard.
To reactivate the zone creation mode, click on the arrow or the CTRL key again. This will open the ribbon, and your zones will appear.
Compare devices, date ranges and segments
Note: If you don't see this feature, you may need to update your CS Live Chrome extension.
Compare your content’s performance metrics across two different devices, date ranges, and segments.
1. Click on the analysis context from the CS Live ribbon.
2. Toggle on the ‘Compare’ button.
3. Select the parameters to compare your metric against: date ranges, segments, or devices.
4. Click ‘Apply’.
You will see two numbers displayed on each zone:
- Your metric result for your first parameter (blue, on the left)
- The percentage variation for that metric in comparison to the second parameter (lilac, on the right)
- Positive variations: are displayed with a “+” symbol highlighted in green
- Negative variations: are displayed with a “-” symbol in red
Example
In the example above we are comparing the Click Rate metric for two segments: New Users versus Returning Users. We understand from the zone metric displayed that the Click Rate for our New Users is 6.12%, which -16.6% less than that of our Returning Users.
Use CS Live Trends
Note: If you don't see this feature, you may need to update your CS Live Chrome extension.
CS Live Trends helps you to identify trends in how users are interacting with your content in real-time, enabling you to take quick action on your site. It works by using a “sliding window” to continuously compare zone metrics for the last hour versus the previous hour, automatically refreshing every 1 minute.
About the “sliding” comparison window
Commonly used in data analytics, a sliding window continuously evaluates data over a set period of time. In this case, we use the sliding window to continuously evaluate a set time period of 60 minutes (e.g. 13:00 to 14:00). With each 1 minute that passes the window of evaluation shifts and evaluates the next 60 minutes (e.g. 13:01 to 14:01), enabling us to display a regular stream of incoming data.
Top use cases
-
Monitor and react to time sensitive campaigns
- For example: You're running a big sales event, such as Black Friday, and want to further promote content that is doing well, or change course on content that isn’t
-
Test new content and reduce risk
- For example: You're testing new content on a high traffic page and want to see instant results, so you can act before it has a significant impact on your KPIs
Enabling CS Live Trends
To use CS Live Trends, click the 'Live' button. The Live button will turn green and begin comparing zone performance for the last hour to the previous hour before that, for today’s date.
1. Click the ‘Live’ button from the CS Live ribbon.
2. Hover over the date ranges to see the hours being compared. From here, you will also note that the times in each comparison window will update every minute.
Note: that if you manually update your analysis context and the comparison window exceeds 24 hours, the sliding window with minute-to-minute updates is deactivated.
You will see two numbers displayed on each zone:
- Your metric of reference, according to the most recent hour that has passed
- The percentage change for that metric in comparison to the hour before
- Positive fluctuations: are displayed with a “+” symbol highlighted in green
- Negative fluctuations: are displayed with a “-” symbol in red
Example
In the example above an ecommerce site enables the Live button at 14:00 to monitor a new banner on their homepage during a limited time sale. They see from the zone metric on the banner that it had 9 clicks in the previous hour (from 12:00 to 13:00), which is an 11.1% decrease in comparison to the hour before that. With each minute that passes, the data is refreshed and they see that the numbers continue to decrease, indicating a downward trend. Therefore, they decide to take action and change the content before it continues to impact their sale.