Ticketing widget

1. Login to your Google Analytics account.

2. Create a new data stream via Admin > Account > Property > Data Streams.

   

   Click the Add streams dropdown, and select the source type you want to stream. Select Web as the source type.

   

3. Set up web stream.

   Fill in the URL of the website hosting the Ticketing widget and choose a stream name. Thereafter, click the Create stream button. Ignore the installation instructions by clicking the close button.

   

4. Copy the Measurement ID (identifier starting with G-)so that it can be used in the setup of Google Tag Manager. You can find it again in Admin > Data collection and modification > Data streams > your stream.

   

1. Login to your Google Tag Manager account and start by creating a new container.

   

2. Fill in a container name, select the correct target platform (Web), and click Create.

   

   Ignore the ‘Install Google Tag Manager’ window for now, by clicking the OK button.

3. On the ‘Workspace‘ page, click Tags and then click New.

   

4. Edit the Tag Configuration and choose Google Analytics: GA4 Configuration as the tag type.

   
   
   

5. Paste the ‘Measurement ID‘ you copied from Google Tag Manager.

   If you need to copy it again, you can find it in Google Analytics > Admin > Account > Property > Data Streams > Your stream > MEASUREMENT ID (identifier starting with ‘G-’).

   

6. Add a trigger by clicking on the Triggering tile and then the + button.

   

7. Click the Trigger Configuration tile and select Custom Event as the trigger type (under Other).

   

8. Complete the Trigger Configuration settings.

   Add the following value to the event name field:

   view_item|add_to_cart|remove_from_cart|begin_checkout|add_payment_info|purchase|refund|view_cart|select_promotion|login|signup

   Note

   Select ‘Use regex matching’.

   

   Give the trigger a name (eg. ‘GA4 - Ecommerce trigger‘) and click Save.

9. Name the tag settings.

   The tag configuration should look like this:

   

   Give it a name (eg. ‘GA4 - Configuration‘) and click Save.

10. Create another Tag by clicking on the New button in the Tags component, and choose Google Analytics: GA4 event as the tag type.

    

11. Complete the Tag Configuration settings.

    Select the tag configuration you created in the previous steps as ‘Configuration Tag'.

    

    For the ‘Event Name‘, click the add event name button next to the input field and select the variable with the name ‘Event‘.

    
    

    This will fill in the ‘Event Name‘ field with the value {{Event}}. Expand More Settings and check Send Ecommerce data.

    

12. Set a trigger by clicking on the Triggering tile and then select the previously created trigger.

    

13. Give the Tag Configuration a name and click Save.

14. Finally, publish the tags.

    First, click the Submit button from the workspace page.

    

    Indicate Publish and Create Version, add a version name and description, and click Publish.

    

15. Copy the script tags that need to be added to the Enviso Ticketing widget webpage.

    Navigate to Admin > Container > Install Google Tag Manager.

    

    Copy the code that needs to be added to the <head> tag.

    

1. Open the webpage where the Enviso Ticketing Widget is hosted.

2. Paste the script code (that was copied in step 15 of setting up Google Tag Manager) within the <head> tag.

3. Publish the webpage.

1. Login to your Google Tag Manager account and open the container used on the website hosting the Ticketing widget. If your website has no container yet, create one: fill in a container name, select Web as the target platform and click Create. Ignore the 'Install Google Tag Manager' window for now by clicking OK.

   

2. Make sure the Google tag exists. Click Tags and look for a tag of type Google Tag with your Measurement ID. If it is missing, click New, choose Google Tag as the tag type, paste your Measurement ID as the Tag ID, select the trigger Initialization - All Pages, name it (eg. 'Google Tag - GA4') and click Save.

   

   Click new button.

   

   Choosing a tag.

   

   Click Google tag. Fill in information and save.

   

3. Create the variables. Click Variables and, under User-Defined Variables, click New. Choose Data Layer Variable as the variable type, fill in the Data Layer Variable Name from the table below and keep Data Layer Version on Version 2. Give the variable the name from the table and click Save. Repeat for each row.

   

   Navigate to variables and click new on User-Defined Variables.

   

   Fill in Data Layer Variable values.

   Variable name	Data Layer Variable Name
   DLV - checkout_step	checkout_step
   DLV - site_language	site_language
   DLV - newsletter_optin	newsletter_optin
   DLV - visit_date	visit_date
   DLV - visit_timeslot	visit_timeslot
   DLV - days_until_visit	days_until_visit
   DLV - payment_type	ecommerce.payment_type
   DLV - cart_discount	cart_discount
   DLV - method	method
   DLV - user_data.sha256_email_address	user_data.sha256_email_address

   Result of all the Data Layer Variable values.

   

4. Create the trigger. Click Triggers and then New. Click the Trigger Configuration tile and select Custom Event as the trigger type (under Other). Add the following value to the event name field:

   ^(view_item_list|select_item|select_timeslot|add_to_cart|remove_from_cart|view_cart|apply_coupon|begin_checkout|add_shipping_info|add_payment_info|purchase|refund|login|sign_up)$

   Note

   Select 'Use regex matching'.

   Keep All Custom Events selected, give the trigger a name (eg. 'CE - Enviso widget events') and click Save.

   Navigate to Triggers and click New.

   

   Fill in trigger information.

   

5. Create the GA4 event tag. Click Tags and then New, and choose Google Analytics: GA4 Event as the tag type. Paste your Measurement ID in the Measurement ID field. For the Event Name, click the add variable button next to the input field and select the variable with the name Event. This will fill in the Event Name field with the value {{Event}}.

   

6. Complete the tag configuration. Expand Event Parameters and add the rows below with Add parameter:

   Event Parameter	Value
   checkout_step	{{DLV - checkout_step}}
   site_language	{{DLV - site_language}}
   newsletter_optin	{{DLV - newsletter_optin}}
   visit_date	{{DLV - visit_date}}
   visit_timeslot	{{DLV - visit_timeslot}}
   days_until_visit	{{DLV - days_until_visit}}
   payment_type	{{DLV - payment_type}}
   cart_discount	{{DLV - cart_discount}}
   method	{{DLV - method}}

   Expand More Settings > Ecommerce, check Send Ecommerce data and select Data Layer as the data source. Set the trigger by clicking the Triggering tile and selecting the trigger created in step 4. Give the tag a name (eg. 'GA4 - Enviso widget events') and click Save.

   
   

7. Respect your visitors' consent. If your cookie banner uses Google Consent Mode, GA4 tags follow it automatically. If it does not, ask your cookie banner provider how to block GA4 tags until the visitor accepts analytics cookies, and apply that to the new tag as well. If you share hashed customer data with ad platforms, also pass the visitor's advertising consent to the widget (see Optional: Share hashed customer data with ad platforms).

8. If you created a new container in step 1, copy the script that needs to be added to the webpage. Navigate to Admin > Install Google Tag Manager and copy the code for the head tag.

   
   

   Note

   Do not publish yet. Test the setup first (see Step 5: Test and publish).

1. Open the webpage where the Enviso Ticketing widget is hosted.

2. Turn on GA4 tracking in the widget. Add the line enviso.settings.gtmVersion = 'v2'; next to the other widget settings. Without it, the widget sends an older format that does not match this setup.

   <script>
       enviso.settings.apiKey = 'your-api-key';
       enviso.settings.salesPointId = 'your-sales-point';
       enviso.settings.gtmVersion = 'v2';
   </script>

3. Make sure the Google Tag Manager code is on the page. If your website already uses Google Tag Manager, nothing changes. Otherwise, paste the script code (copied in step 8 of setting up Google Tag Manager) within the head tag, as high as possible.

4. Publish the webpage.

   Note

   Add the setting on every page that shows the widget. If your Google Tag Manager code uses a different name than dataLayer, the widget detects it automatically.

1. In Google Analytics, navigate to Admin > Data display > Custom definitions.

2. On the Custom dimensions tab, click Create custom dimension. Fill in the fields from one row of the table below and click Save. Repeat for each row.

   Dimension name	Scope	Event parameter / Item parameter
   Checkout step	Event	checkout_step
   Site language	Event	site_language
   Newsletter optin	Event	newsletter_optin
   Visit date	Event	visit_date
   Visit timeslot	Event	visit_timeslot
   Payment type	Event	payment_type
   Signin method	Event	method
   Item visit date	Item	visit_date
   Item visit timeslot	Item	visit_timeslot

   
   

3. On the Custom metrics tab, click Create custom metric and create the two metrics below.

   Metric name	Scope	Event parameter	Unit of measurement
   Days until visit	Event	days_until_visit	Standard
   Cart discount	Event	cart_discount	Currency

   

4. purchase is marked as a key event automatically. To count other events as key events, navigate to Admin > Data display > Events and switch on Mark as key event once the event appears in the list.

When all steps are executed correctly, data from the Ticketing widget will become available in the Google Analytics reports after 24 to 48 hours.

1. In Google Tag Manager, click Preview, enter the address of a page with the Ticketing widget and click Connect. Your website opens in a new window and a Tag Assistant tab shows what happens. Accept analytics cookies in your cookie banner.

2. Go through a booking in the website window. In Tag Assistant, a new line appears for each widget event. Click an event and check that GA4 - Enviso widget events is listed under Tags Fired.

   

3. In Google Analytics, navigate to Admin > DebugView. After a few seconds your test visit appears with the events in order. Click an event to see its parameters and products.

   

4. Finally, publish the container. Click the Submit button on the workspace page, select Publish and Create Version, add a version name (eg. 'Enviso widget tracking') and click Publish.

   
   

1. Switch it on in the widget. Add the line below next to the other widget settings (see Step 3: Setup webpage hosting the Enviso Ticketing widget).

   <script>
       enviso.analytics.optIns.customerData = true;
   </script>

2. Pass your visitor's advertising consent to the widget. Wherever your cookie banner reports the visitor's choice, set adUserData. It matches Google Consent Mode's ad_user_data signal. If your cookie banner has no Consent Mode, use its "marketing" category. Google Consent Mode itself does not reach the widget, so this step is also needed when you use Consent Mode.

   // Visitor accepts marketing / advertising cookies
   enviso.analytics.consents.adUserData = 'granted';
   
   // Visitor refuses, or withdraws consent later
   enviso.analytics.consents.adUserData = 'denied';
   
   // Your cookie banner doesn't know yet (first visit, or consent expired)
   enviso.analytics.consents.adUserData = undefined;

   Note

   These lines work before and after the widget has loaded. Place them after the widget's loader script, like the other widget settings. Only set the field you need; don't replace the whole enviso.analytics object.

3. Keep the consent up to date. Set the state on every page load, as soon as your cookie banner knows it, and again whenever the visitor changes it. Use undefined when the consent is unknown, so an old choice is not reused.

4. Use the hashed email in your ad platform. For Google Ads, create a Data Layer Variable for user_data.sha256_email_address, a User-Provided Data variable of type Code that returns { sha256_email_address: ... }, and add it to your Google Ads conversion tag. Follow Google's https://support.google.com/google-ads/answer/13262500. For Meta or another platform, map the same variable to that platform's hashed email field (for Meta: em).

5. Test it. In Preview, grant advertising consent and complete a test order: the purchase event contains user_data.sha256_email_address. Repeat with consent refused: the purchase event has no user_data.

   Note

   Keep it out of Google Analytics 4. Google's terms don't allow personal data in GA4, so don't add user_data to the GA4 event tag.