How to monitor traffic from AI Overviews in Google Search

Tracking traffic from AI-generated overviews can help you understand how your website content is being discovered. And can help you evaluate whether changes to your SEO content strategy are affecting your rankings in AI overviews on Google Search. Currently referral traffic is recorded as just “direct” when users click as the links are marked with “noreferrer” tags. But there is a rather unique url structure used when visitors click on your site from these AI summaries. With some setup work, this specific pattern that can be identified and tracked in Google Analytics 4 (GA4) allowing you to track AI Overviews clicks. This guide walks you through setting up tracking to capture this data effectively.

Understanding the URL Structure

When someone clicks from an AI overview to your site, the URL contains a distinctive pattern:

• It includes #:~:text= followed by the text being highlighted.
• Example: yourwebsite.com/article#:~:text=beginning_of_highlight...ending_of_highlight
• This pattern applies to AI overviews, enhanced snippets, and question boxes.

Implementation process

Step 1: Set Up Custom JavaScript Variables in Google Tag Manager (GTM)

1. Launch Google Tag Manager
2. Navigate to Variables → New
3. Select “Custom JavaScript” as the variable type
4. Create two JavaScript variables:

First Variable (Capturing Highlight Beginning):

• Name: js_ai_highlight_begin

function() { var pageUrl = document.URL; if (pageUrl.includes('#:~:text=')) { var highlightText = decodeURIComponent(pageUrl.split('#:~:text=')[1]); var beginText = highlightText.split('...')[0]; return beginText; } return undefined; }

Second Variable (Capturing Highlight Ending):

• Name: js_ai_highlight_end

function() { var pageUrl = document.URL; if (pageUrl.includes('#:~:text=')) { var highlightText = decodeURIComponent(pageUrl.split('#:~:text=')[1]); var segments = highlightText.split('...'); return segments.length > 1 ? segments[1] : ""; } return undefined; }

Step 2: Create a Trigger for Highlight Detection

1. Go to GTM → Triggers → New
2. Choose “Page View” as the trigger type
3. Select “Some Page Views”
4. Set the condition: js_ai_highlight_begin is not null
5. Name the trigger: pageview_ai_highlight_detected
6. Save the trigger

Step 3: Build a GA4 Event Tag

1. Go to GTM → Tags → New
2. Choose “Google Analytics: GA4 Event”
3. Enter your GA4 Measurement ID
4. Set the event name: ai_highlight_click
5. Add event parameters:
   • Parameter 1: highlight_begin → Select js_ai_highlight_begin variable
   • Parameter 2: highlight_end → Select js_ai_highlight_end variable
6. Assign the trigger created in Step 2
7. Name the tag: GA4 - event - ai_highlight_click
8. Save the tag

Step 4: Configure Custom Dimensions in GA4

1. Go to GA4 → Admin → Custom Definitions
2. Select “Create Custom Dimension”
3. For the first dimension:
   • Event parameter: highlight_begin
   • Dimension name: AI Highlight Beginning
   • Scope: Event
   • Save
4. Repeat for the second dimension:
   • Event parameter: highlight_end
   • Dimension name: AI Highlight Ending
   • Scope: Event
   • Save

Step 5: Validate and Deploy

1. Preview your GTM container
2. Test by visiting a URL containing the #:~:text= parameter
3. Check if the event triggers properly in GTM’s Debug Mode
4. Submit and publish your changes

Conclusion

This tracking method helps you understand not only which pages appear in AI-generated overviews but also how visitors interact with your site after clicking through. With this data, you can optimise your content strategy accordingly.