Getting Started

In this documentation, you will learn everything you need to know about the ‘Google Custom Event Trigger’. To know the whole process required to integrate this mentioned feature into your website, follow all the steps below accordingly.

What does Google Custom Event Trigger Do?

The ‘Custom Event Trigger’ feature is used to track interactions (specific button & link clicks) that occur on your website. You can integrate this feature into both your Dorik Classic & CMS site with the help of Google (Google Tag Manager & Google Analytics) from your Dorik website builder.

How to integrate Google Custom Event Trigger

Integrating Google Analytics (GA) & Google Tag Manager (GTM)

To learn how to integrate GA and GTM on Dorik refer to the articles below:

Google Analytics Integration

Google Tag Manager Integration

Adding Google Analytics to Google Tag Manager

Follow the steps below to learn how to add GA4 configuration to GTM —

• Once you are in your tag manager, press **Add a new tag** under New Tag
• Give a title to the new tag
• Click on Tag Configuration
• Select Google Analytics: GA4 Configuration
• Go to Google Analytics and Select the Data Stream that you added to your site
• Copy the MEASUREMENT ID
• Enter the MEASUREMENT ID of Analytics under the Measurement ID field
• Scroll down, tab Triggering & select All Pages .
• Press Save from the upper right corner
• Press **Submit** from your Tag Manager Dashboard
• Give a version name under the Version name field
• Press Publish
• Your new tag will be created & the Google Analytics will be added to that Tag
• Before submission, you can preview your tag by pressing the **Preview** button
• After pressing the Preview button a pop-up will appear
• Enter your website URL on that pop-up
• Click on **Connect** & you can see the Debug version of your website

The GIFs below show the whole process being demonstrated visually ⬇️

• Once you are in your tag manager, press Add a new tag under New Tag
• Give a title under Untitled Tag on the top
• Tab Tag Configuration
• Select Google Analytics: GA4 Configuration

• Go to Google Analytics and Select the Stream that you added to your site
• Copy the MEASUREMENT ID
• Enter the MEASUREMENT ID of Analytics under the Measurement ID field
• Scroll down, tab Triggering & select All Pages
• Press Save from the upper right corner

• Press Submit from your Tag Manager Dashboard
• Give a version name under the Version name field
• Press Publish
• Your new tag will be created & the Google Analytics will be added to that Tag

• Before submission, you can preview your tag by pressing the Preview button
• After pressing the Preview button a pop-up will appear
• Enter your website URL on that pop-up
• Click on Connect & you can see the Debug version of your website

Adding Event Trigger (GA4 Event) to Google Tag Manager

Follow all the steps below to learn how to add GA4 Event to GTM —

• Go to your Dorik website builder & select the specific event (button) you want to track
• Click on **Edit Element** & the Editor will be open
• From the Editor, Go to Advanced & select HTML Selectors
• Enter an Id name under the HTML ID field
• Press **Publish**
• Go to the Tag Manager dashboard & click on Variables from the right-side panel
• Click on **Configure** from the upper right corner
• After clicking Configure a sidebar will open, scroll it down
• Go to Clicks & ****enable all the options by clicking on 🔲
• Go to Tags again & create a new tag by pressing **New** from the upper right corner
• Give a title under Untitled Tag on the top
• Tab Tag Configuration
• Select Google Analytics: GA4 Event
• Select the configuration tag that you created before from the dropdown under the Configuration Tag filed
• Enter the event name under the Event name field
• Press Save & a pop-up will appear
• Press Save Tag & Save again
• Scroll down & Tab Triggering
• Click on ➕ (new trigger) from the top of the right corner
• Give a title under Untitled Trigger on the top
• Tab Trigger Configuration & a sidebar will open
• Scroll it down and go to Click
• Click on Just Links
• Click on **Some Link Clicks**
• Select Click ID from the first dropdown box
• Enter the HTML ID name of the specific event (button) under the Last box
• Press Save from the top right corner
• Once you click save it will take you to your Tag page & now press Save again
• Finally, press Submit from the upper right corner
• Give a version name under the Version name field
• Press Publish
• Your new Event trigger will be created inside your Tag Manager
• Before submission, you can preview your tag by pressing the **Preview** button
• After pressing the Preview button a pop-up will appear
• Enter your website URL on that pop-up
• Click on **Connect** & you can see the Debug version of your website

The GIFs below show the whole process being demonstrated visually ⬇️

• Go to your Dorik website builder & select the specific event (button) you want to track
• Click on Edit Element & the Editor will be open
• From the Editor, Go to Advanced & select HTML Selectors
• Enter an Id name under the HTML ID field
• Press Publish

• Go to the Tag Manager dashboard & click on Variables from the right-side panel
• Click on Configure from the upper right corner
• After clicking Configure a sidebar will open, scroll it down
• Go to Clicks & enable all the options by clicking on 🔲

• Go to Tags again & create a new tag by pressing New from the upper right corner
• Give a title under Untitled Tag on the top
• Tab Tag Configuration
• Select Google Analytics: GA4 Event
• Select the configuration tag that you created before from the dropdown under the Configuration Tag filed
• Enter the event name under the Event name field
• Press Save & a pop-up will appear
• Press Save Tag & Save again

• Scroll down & Tab Triggering
• Click on ➕ (new trigger) from the top of the right corner
• Give a title under Untitled Trigger on the top
• Tab Trigger Configuration & a sidebar will open
• Scroll it down and go to Click
• Click on Just Links
• Click on Some Link Clicks
• Select Click ID from the first dropdown box
• Enter the HTML ID name of the specific event (button) under the Last box
• Press Save from the top right corner
• Once you click save it will take you to your Tag page & now press Save again

• Finally, press Submit from the upper right corner
• Give a version name under the Version name field
• Press Publish
• Your new Event trigger will be created inside your Tag Manager

• Before submission, you can preview your tag by pressing the Preview button
• After pressing the Preview button a pop-up will appear
• Enter your website URL on that pop-up
• Click on Connect & you can see the Debug version of your website

Tracking in Google Analytics

Follow the GIF below to learn how you can track custom event trigger in google analytics —

• Go to Google Analytics & click on Report from the sidebar
• Click on Real Time & you can see the result

Related Articles

Custom Code Element
Add Custom Code
Google Tag Manager Integration
How to Add Google Analytics on your Website?

Updated on: 05/04/2023