Available on: Mini plan and above (previously: Starter plan and above)
Site analytics in Studio.Design
Studio.Design comes with a built-in analytics feature that automatically starts tracking as soon as your site is published (Studio Analytics). You can view the data from your Studio.Design dashboard.
Once you connect Google Analytics (GA) to your Studio.Design project and authorize your account, you'll be able to:
Switch the analytics data shown in Studio.Design to GA data
Create and set up key events within Studio.Design
This article walks you through the setup required to view GA data in Studio.Design and explains how to read the data (option (2-B) in the table below).
| Data source | Where to view | Highlights | Setup required |
(1) | Studio.Design dashboard | View basic data such as page views and visitors for each page. | None — it's built in | |
(2-A) | Google Analytics | Google Analytics | View more detailed analytics and custom reports. | Connect GA to your Studio.Design project |
(2-B) | Google Analytics | Studio.Design dashboard | View key GA data — such as devices and regions — directly in Studio.Design. |
|
Because Studio Analytics and Google Analytics use different measurement methods, their numbers won't match exactly (for example, "Visitors" vs. "Users").
Switching the dashboard to show GA data
Here's how to switch the analytics data shown on your Studio.Design dashboard to GA data.
Step 1. Connect GA to Studio.Design
Before you can view GA data in Studio.Design, you'll need to connect GA to your Studio.Design project.
For instructions, see Connecting Google Analytics (GA).
Step 2. Authorize your Google account
After connecting GA, follow these steps to authorize your Google account. Once authorized, the analytics dashboard in Studio.Design will show GA data, and the built-in Studio Analytics data will no longer be displayed.
Open the [Analytics] dashboard for the Studio.Design project connected to GA.
Click [Authorize] to authorize your Google account.
Select the Google account you're signed in to GA with, and [Allow] access to studiodesignapp.com.
Once authorization is complete, the analytics dashboard will show GA data.
Switching the dashboard back to Studio Analytics
Even after connecting GA, Studio Analytics continues to track your site in the background. If you revoke your Google account authorization, the dashboard will switch back to showing Studio Analytics data.
How to revoke Google account authorization
Open the [Analytics] dashboard.
Open [Overview], then click the menu icon ([…]) in the top-right corner.
Click [Revoke authorization].
GA data you can view in Studio.Design
After connecting GA and authorizing your Google account, you can view your data from [Overview], [Real-time], [Pages], and [Key events] in the left-hand menu.
(1) Overview
Shows an analytics summary through the end of yesterday. Due to how GA works, data from the current day isn't available here.
Tip: You can view data from the current day — but only for the last 30 minutes — under [Real-time].
What you can view
The chart at the top shows the number of visitors and conversions.
Use [All key events] in the top-right to filter conversions by a specific key event.
Below the chart, you can also view:
Pages (page views)
Traffic sources
Average time on page
Devices
Languages
Regions
Gender*
Age*
*The gender and age data available depends on your GA settings. If there isn't enough data, these sections may not appear at all. For details, see Google's official help article.
Choosing a date range
Use one of the preset ranges below to set the period for the data shown. If you choose [Custom], you can select or enter dates in the calendar.
Last 7 days
Last 30 days
Last 90 days
Last week
Last month
Custom
(2) Real-time
Shows data from the last 30 minutes. Due to how GA works, only the last 30 minutes of same-day data is available.
Current traffic
Site visits over the last 30 minutes are shown in a minute-by-minute chart. Hover over a bar to see the exact number of page views.
Key events in the last 30 minutes
Shows key events triggered in the last 30 minutes, along with the number of times each was triggered.
(3) Pages
View the number of visitors and page views for each page.
Use the top-right of the screen to change the date range.
(4) Key events
Shows a list of key events created in both Studio.Design and GA, along with how many times each has been triggered.
You can't see where each key event is placed in the editor.
Due to GA's limits, each project can have up to 30 key events.
Key events created in Studio.Design are automatically prefixed with "studio_cv_".
Only click events can be tracked. You can apply key events to boxes even if they don't have a link set.
Creating and deleting key events
Click [Create new] in the top-right to create a key event. Each project can have a total of 30 key events.
To delete a key event you created in Studio.Design, click the […] icon to the right of the key event name.
Setting up key events in Studio.Design
Here's how to create a key event in Studio.Design and add it to the editor.
Open the design editor for your Studio.Design project.
Select the box where you want to place the key event.
Open the [Settings] tab in the right-hand panel. If the panel is closed, open it first.
Under [Conversion tracking], choose an existing key event or create a new one from [Key event name]. Each project can have up to 30 key events.
Verify that the setup is working correctly. Click the box configured with the key event, and confirm on the GA side that the key event is being measured. Google Analytics does not function on the live preview URL; please perform this verification on the published site.
Note: About the ID of the box with a key event
When you set a key event, if the box ID is empty, an ID will be filled in automatically.
If you change or delete the box ID after setting up a key event, the key event setting will be removed.
Frequently asked questions
Q. If I'm tracking GA4 through Google Tag Manager (GTM), how do I view GA data in Studio.Design?
Q. If I'm tracking GA4 through Google Tag Manager (GTM), how do I view GA data in Studio.Design?
A. Connecting GTM alone won't switch the Studio.Design [Analytics] dashboard to GA data.
To view GA data in Studio.Design, you'll need to connect the measurement ID and authorize your account. Here's how to do this without ending up with duplicate tracking:
In Studio.Design, connect the measurement ID for the same GA4 property that GTM uses. The GA tracking tag (gtag.js) will be added to your Studio.Design site.
In GTM, pause or delete the GA4 configuration tag (Google tag) to disable it and avoid duplicate tracking.
In Studio.Design, authorize your Google account.
Note: You don't need to disconnect GTM
You can keep using tags other than GA, so there's no need to disconnect GTM itself.
Your existing GA tracking data will still be available in Studio.Design after authorization.