This article will take you through what you need to know to create and manage your Zonings.
A zoning is a static screenshot of your website. A screenshot is an image captured of your site, used to analyze your pages. You analyze your screenshot by using zones – colorful data overlays that use the div structure of your site to identify where the elements on the page are.
How to create a Zoning Analysis
1. From the Zoning Analysis section, click '+ New Zoning',
2. Click 'Select page' and define which page you want to analyze, then click 'Apply'.
You can choose between:
- 'Page group on the fly': analyze data from a specific URL or multiple URLs with specific conditions,
- or 'All page groups': analyze a page group from an existing mapping.
3. Refine your Zoning Analysis by choosing which segment you want to analyze, then click 'Continue'.
Using Live capture into Zoning
When creating a Zoning Analysis, you can choose from either an existing screenshot or use Live Capture to take a manual one.
Live Capture shows you the live page you want to capture a screenshot of from your website. Please note that it is impossible to create zones insides the live capture window.
Capture the screenshot by either using the 'Capture a new snapshot' CTA or the shortcut (varying on your device). Don't forget to click 'Save to Contentsquare'.
You will find the screenshot inside your new zoning or in the screenshot library of your existing zoning.
How to create specific zones
Zones are colorful data overlays that use the div structure of your site to identify where the elements on the page are. They are used inside the Zoning to analyze a screenshot. You can either create new zones or erase them.
To create zones, you need to be in 'Edit mode', it is enabled by default on your Analysis:
1. If you need to activate edit mode during your analysis, you can do so by clicking the 'Edit zones' button.
2. Select your zoning creation mode from the drop-down menu. You can create either one or multiple zones at a time.
- Single zone mode: Click on the 'Single' button, then hover over the content where you want to create a zone. Click inside the colored frame that appears. Your zone will be created.
- Multi-zone mode: Click on the 'Multi' button and hover over your content. Click inside the colored frame that appears and your zones will be created.
Note
Multi-zone mode only identifies zones on the hierarchy level in your div structure.
- Top zones (ex Smart Zone): Click on the 'Top zones' button in the right side panel to discover which zones are the most clicked on your page. Please note that Top Zones are shown only with 'Click rate (pageview level)' and 'Click recurrence'.
How to use Advanced Analysis
The 'Advanced Analysis' option lets you manually capture a screenshot from the live version of your site, or create an A/B test via integration.
Capture a screenshot from the live version of your site – Screenshot URL
Choose where your analysis screenshot is captured from. URLs shown match the page group selected in your Zoning Analysis:
- Select the page you want to analyze, filter your analysis, then click on 'Advanced analysis';
- Define the screenshot URL you want to analyze by selecting it in the drop-down menu, then click on the 'Continue' button.
Create and analyze an AB Test
Note:
In order to use the AB Test option, you need to install an AB Test integration first. Read more in our integrations catalog. Also note that only admins can add integrations to a project.
Choose where your analysis screenshot is captured from. URLs shown need to match the page group in your Zoning Analysis:
- Select the page you want to analyze, filter your analysis, then click on 'Advanced Analysis'.
- Click 'Analyze AB Test';
- Select either 'With integrations' or 'With dynamic variable' depending on your needs.
- Then choose the variation or dynamic variable you want to analyze from the drop-down list, click on 'Continue'.
- Select the most accurate screenshot of your page, or create a new one and create your Zoning.