How to track events using URL variables

With Tag Manager, you can use an event trigger to track specific actions on your website such as the number of times users watch a video or click a button.

Set up a user-defined URL variable

To track every time users click the “Book Now” button on the Travel Adventures site, we’ll first need to set up a user-defined URL variable. In Tag Manager, click “Variables.” Then scroll down and select “New.”

We’ll title this variable “URL Destination.”

Since we want to track the URL where “Book Now” button-clicks occur, choose the tag type “URL.” Because we only need to track the part of the URL that contains the country name, choose the component type “Fragment.”

This will grab everything in the URL after the “hash” symbol. For instance, The Great Outdoors URL for the Switzerland vacation page would simply return “switzerland.” Click “Create Variable.”

Set up the event trigger

Now that we’ve set up our user-defined variable, we’ll need to create an event trigger that will fire when the “Book Now” button is clicked. On the Travel Adventures website, if we inspect the element for the button, we can see that there’s a class called “booknow” available on the “Book Now” button.

Since Tag Manager already has a built-in variable that can be used with classes, we can use this to set up an event trigger. To enable the variable, click “Variables.” Then click the checkbox next to “Click Classes.”

Next, we’ll need to set up the event trigger. Click “Triggers.” Then click “New.”

We’ll name this event trigger “Book Now clicks.” Since we want to track clicks, select the Event Type as “Click.” Then select “Continue.”

Because “Book Now” is an HTML link styled as a button, to configure the trigger, select “Link Click.” We’ll leave “Wait for Tags” checked and “Max wait time” at “2000” to give the tag time to fire after users click “Book Now.” Then click “Continue.”

Note the message that comes up, warning you to be careful that no other scripts interrupt this process.

Now, in the “Enable When” section, we need to set up the trigger to be available when the “booknow” class is present. Select the variable “Page URL” in the first pulldown menu. Then select the operator “contains.” Finally, we’ll enter the value “destinations.html”. Then click “Continue.”

Because we only want the trigger to fire when the URL contains "destinations.html", in the “Fire On” section choose “Some Clicks.” Click classes is already selected, so leave that as is. Leave the operator as "contains". In the right-hand field, we'll type "booknow". Then click Save Trigger. Then, similar to when we enabled the trigger, we’ll need to set the same parameters for the trigger to fire. Select the variable “element classes” in the first pulldown menu. Then select the operator “contains.” Finally, we’ll enter the value “booknow.” Then click “Save Trigger.”

Copy the Analytics tag

Now that we’ve set up our built-in variable and created our trigger, we’ll need an Analytics event tag that will fire whenever the “Book Now” button is clicked. Instead of recreating the tag from scratch, we can copy the existing Analytics “Page View” tag, so it will include all the configurations we’ve made so far such as cross-domain tracking.

Click “Tags.” Then select the Analytics “Page View” tag. At the bottom right, select “Copy.”

Update the Analytics tag configurations

Notice the new title that shows we’ve made a copy of this tag. Then let’s update the name to reflect our new tag. Click the section “Configure Tag.” Now change the track type from “Page View” to “Event.” Notice when you select “Event,” additional fields for Category, Action, Label and Value appear.

We can name our Category parameter anything we like, so to help us sort our data in Analytics, we’ll call it “Bookings.” So we know which button is getting clicked, we’ll set our Action parameter to “Book Now.” For Label, to the right of the field, click the selector icon. Then select the variable we created earlier called “URL Destination.” The Value field is optional, so we’ll leave it blank for now. Since we don’t need to worry about this event affecting our bounce rate, we’ll leave Non-Interaction hit set to “False.” Now click “Continue.”

In the “Fire On” section, since we want to track clicks from the “Book Now” button, choose “Click.” Since we only want the tag to fire when the “Book Now” button is clicked, remove the “All Pages” trigger by clicking the “x” next to “All Pages.” Then select “More.” A dialog box will open showing your available triggers. Select the “Book Now clicks” trigger you created earlier. Then click “Save.” To finish, click “Create Tag.”

Now that we’ve set up event tracking on the Travel Adventures “Book Now” button, we can see the bookings in Analytics and divide that number by the total number of users to derive the Booking Conversion Rate.

Was this helpful?

How can we improve it?
true
Choose your own learning path

Check out google.com/analytics/learn, a new resource to help you get the most out of Google Analytics 4. The new website includes videos, articles, and guided flows, and provides links to the Google Analytics Discord, Blog, YouTube channel, and GitHub repository.

Start learning today!

Search
Clear search
Close search
Main menu
7632823795472571612
true
Search Help Center
true
true
true
true
true
69256
false
false