How to integrate widgets with Google Analytics 4

Google Analytics is a free service by Google. It helps you analyze your website visitors’ behavior by showing which channel they use to arrive at your website, how long they stay on it, and what they do during their visits.

If you connect Getsitecontrol to your Google Analytics account, you can also collect detailed statistics on how your site visitors interact with your widgets.

❗ Please note that the Google Analytics tracking code should already be installed on your site for the integration with Getsitecontrol to work.

1. Open the Integrations tab

When editing a widget that you want to connect to Google Analytics 4, switch to the Integrations tab from the top bar:

2. Enable the integration

Find the Integrate with Google Analytics section and check the corresponding checkbox:

❗ Please note that you must connect each widget to Google Analytics separately.

That's all you need to set up to start sending events to your Google Analytics dashboard.

3. View events in Google Analytics 4

You can send the following Event Actions to Google Analytics 4 from Getsitecontrol:

• getsitecontrol_show a visitor sees the widget
• getsitecontrol_close a visitor clicks the close button, an action button that closes the widget, or the widget background (if it is set to close the widget)
• getsitecontrol_showWidget a visitor clicks a button that shows another widget
• getsitecontrol_submit a visitor clicks a button that submits the data
• getsitecontrol_openUrl a visitor clicks a button that opens a URL
• getsitecontrol_copyToClipboard a visitor clicks a button that copies text to the clipboard.

Additionally, if you have a Shopify store, you can send two more Event Actions to Google Analytics 4:

• getsitecontrol_addToCart a visitor clicks a button that adds an item to their cart
• getsitecontrol_applyDiscount a visitor clicks a button that applies an automatic discount to their cart.

To view the events for Getsitecontrol widgets in GA4, switch to Reports and open Examine user behaviour. Select Events from the list:

By default, the URL of the page where the event has occurred will be sent to GA4 along with the event data.

If you have installed Google Analytics 4 on your website directly, the events will be automatically sent to the GA4 dashboard.

❗ If you have used Google Tag Manager to install Google Analytics 4 on your website, widget events will only be sent to GTM. To see the events in your GA4 dashboard as well, you’ll need to specifically configure your GTM account as follows.

How to send events from GTM to GA4: additional configuration

Here are the steps to configure Google Tag Manager to send Getsitecontrol events to Google Analytics 4.

​Step 1: Create a Getsitecontrol Event trigger

In GTM, create a ‘Getsitecontrol Event’ trigger that will fire whenever a widget event is sent.

Choose Custom event as the trigger type, enter ‘gsc.’ as the event name, and check the ‘Use regex matching’ box.

In the ‘This trigger fires on’ section, select All custom events.

​Step 2: Create a Getsitecontrol GA4 Event tag

Create a ‘Getsitecontrol GA4 Event’ tag that will send an event to GA4 whenever the ‘Getsitecontrol Event’ trigger is fired.

In Tags, click New and proceed to Tag Configuration. Select Google Analytics and choose Google Analytics: GA4 event as your tag type.

In the tag configuration settings, enter your Measurement ID. You can find it in the Admin section of your GA4 account by following these instructions.

Next, enter {{GSC Event name}} as the event name.

Add a parameter under Event parameters. These are the parameters that you can add:

Step 3: Create a new variable in Google Tag Manager

Create a new variable in GTM. Choose Data Layer Variable as the variable type. Enter GSC Widget Id as the title and gsc.widgetId as the Data layer variable name. Under ‘Data layer version’, select Version 2.

Make sure to save the variable before moving on to the next steps.

If you have set the ‘widget_name’ or ‘event_data’ event parameters in the ‘Getsitecontrol GA4 Event’ tag (see previous step), you’ll need to create additional variables as follows.

Create a Widget Name variable

Repeat the steps from the section above: create a new variable and choose Data Layer Variable as the type. This time, enter GSC Widget name as the title and gsc.widgetName as the Data layer variable name. Under ‘Data layer version’, select Version 2.

Create an Event Data variable

Create a new variable and choose Data Layer Variable as the type. Enter GSC Event Data as the title and gsc.eventData as the Data layer variable name. Under ‘Data layer version’, select Version 2.

With this variable, if the widget button features an Open URL action, Getsitecontrol will send the URL to GA4; if the widget button features a Show widget action, Getsitecontrol will send the Widget ID to GA4.

Step 4 (Optional): Create a variable to format Getsitecontrol event labels

Getsitecontrol events are labeled ‘gsc.show’, ‘gsc.close’, and so on. Event names in GA4 can only contain alphanumeric characters or underscores. To comply with this rule, create a ‘GSC Event name’ variable:

Configure the variable as follows:

Variable Type: RegEx Table

Input Variable: {{Event}}

Pattern: gsc.(.*)

Output: getsitecontrol_$1

Under ‘References’, select Getsitecontrol GA4 Event tag.

This step is optional. To avoid it, you may want to use {{Event}} in the tag configuration to send events as they are.

Step 5: Register widget events as custom definitions in GA4

In Google Analytics 4, go to the Admin section and select Custom Definitions from the list.

Create custom definitions for each Getsitecontrol event you want to pass to Google Analytics 4, as shown in the screenshot above.

Your Google Tag Manager configuration is now complete. New custom events will appear on the GA4 dashboard within 24 hours.

That’s all you need to know about integrating widgets with Google Analytics. Now go ahead and set up an integration for your widgets.

If you are having issues with the integration setup or you’re not seeing the events in your Google Analytics account, do not hesitate to contact our Tech Support team.