Add Google Analytics to your Laravel application with Google Tag Manager.

7 min readApr 7, 2022

How it all started

You almost finished developing your Laravel application and then your managers asks you “how many users did register last week?”. The next day your manager says they also need to know the number of registered users per month, but limited to the users that registered in the Netherlands. We all went through this.. from now on we direct them to Google Analytics where they can find everything they need — for their marketing and sales reports.

But, Google Analytics doesn’t know anything about our site yet. You probably already added the Google Analytics or Google Tag Manager script to your site to track the visitors —but after this tutorial you’ll be able to add all kinds of events and metrics to your Google Analytics dashboard to make it even more useful.

Google Analytics or Google Tag Manager

You probably heard about both of them but what is the difference between them and which one should you use?

We’ll add the Google Tag Manager script to our Laravel site (on every page). On each page load the script will then send data to Google Tag Manager. And Google Tag Manager will then send that data to Google Analytics.

We don’t add the Google Analytics (gtag.js) script to your site. Instead we link our Google Analytics inside Google Tag Manager. The Tag Manager allows you to link Google Analytics properties, but also Facebook Pixel, Tiktok Pixel, HubSpot, etc. and many other snippets. So you only have have 1 place to manage all your integrations.

The benefit of this setup is that we as a developer only need to add the Google Tag Manager script to your site. Later if you have to add the Facebook Pixel tracking code to the site — you can add that inside Google Tag Manager and you don’t have to change your code.

Another benefit of using Google Tag Manager is that the Tag Manager allows you to create custom triggers and filter/format data before sending it to Google Analytics. The Google Tag Manger also has a ‘preview’ mode that you can use to test your script and events. The preview mode will open your site in a new browser and show all events that are fired while you’re interacting with your site.

Create a Google Analytics property

Yes, we first create a Google Analytics property and after that we’ll create a Google Tag Manager workspace.

We will create a Google Analytics 4 property (G-XXXXXX) which is the default option when you create a new property in GA. This is the successor of the Universal Analytics property (UA-XXXXXX).

Go to Google Analytics and do the following:

Create a GA4 property
Create a data stream and select the option ‘web’

You will have to enter your domain name and after that you can keep all the default options.

Create a Google Tag Manager workspace

Go to the Google Tag Manager and create a new workspace. Now we will connect our Google Analytics 4 property to our Google Tag Manager workspace.

Just so you know:

GA4 property measurement ID format: G-XXXXXXXXX
Tag Manager workspace ID format: GTM-XXXXXXX

Inside the workspace you create a Tag and select Google Analytics: GA4 Configuration and you enter your Google Analytics ID in the Measurement ID field.

Add the Laravel Tag Manager package to your application

We install the package through composer.

For more information you can visit the documentation on: https://github.com/Label84/laravel-tagmanager

composer require label84/laravel-tagmanager

We add the TagManager script to the page template view, usually this will be app.blade.php. This loads the script on all pages.

    <x-tagmanager-head />
</head>

<body>
    <x-tagmanager-body />

We add the middleware to to our ‘web’ middleware group in App/Http/Kernel.php. Make sure you add the TagManagerMiddleware after the StartSession middleware. The TagManagerMiddleware makes use of the Laravel Session to temporary save the items for the data layer. These items will then be loaded from the Session and added to the data layer on the first next page load.

protected $middlewareGroups = [
    'web' => [
        \App\Http\Middleware\EncryptCookies::class,
        ...
        \Illuminate\Session\Middleware\StartSession::class,
        \Label84\TagManager\Http\Middleware\TagManagerMiddleware::class,
        ...

We publish the config file to our application.

php artisan vendor:publish --provider="Label84\TagManager\TagManagerServiceProvider" --tag="config"

Add the following 2 variables to your .env file.

GOOGLE_TAG_MANAGER_ID=GTM-XXXXXX
GOOGLE_TAG_MANAGER_ENABLED=true

Now we finished the setup of the TagManager package.

Add a sign up event

We’ll now add an event that will let Google Analytics know each time a user registers and include the corresponding user type (in our case buyer vs seller).

We locate the file that handles the registration of new users. In our case this is the RegisterController. After a user is registered and before we redirect to a new page, we add the following snippet.

use Label84\TagManager\Facades\TagManager;TagManager::register(['user_type' => 'seller']);

This snippet will automatically create an sign_up event. The sign_up event is one of Google Analytics recommended events (https://support.google.com/analytics/answer/9267735?hl=en). We use register instead of signUp as register is more ‘Laravel’ language but the register method used ‘sign_up’ behind the scenes.

We finished the implementation on the Laravel side. In the next section we’ll setup Google Tag Manager, so the Tag Manager knows what to do and what to send to Google Analytics.

Setup the Variable, Trigger and Tag

In the left sidebar of your Tag Manager Workspace — click Triggers and add the following (see screenshot). The references will still be empty as we did not link it yet. After we completed the full setup you’ll see the references.

Now save the trigger and click on Tags in the left sidebar.

We’ll select the Tag Type: GA4 Event, select our GA4 configuration that we did setup earlier. And we enter the event name ‘sign_up’.

We want to use a user property in Analytics, so we can have more detailed reports. Besides how many users signed up in our Laravel application, we can than also filter how many sellers or buyers did sign up.

We’ll add a User Property and use this as reference in our Tag. We can also do it without creating a reference, but we like to follow the standards and this will help you later on if you have a lot of custom properties — and you want to change the variable name and you used it in many tags.

Click on Variables in the left sidebar, and click ‘New’ in the User-Defined Variables section.

We select ‘Data Layer Variable’ and enter the name ‘user_type’.

We want to be able to filter on the user type in our Google Analytics. Therefore we also include the user property user_type in the Tag. This will allow you later on to filter on user types metrics in the the Analytics tables and graphs.

Preview Time

We finished the setup in Tag Manager. Now before we submit it we’ll check if our setup works as expected. We can click preview (next to the blue submit button). This will open your site in a new window. Every time you perform an action on your site you’ll see the Tags and Trigger that are triggered. If you register on your Laravel application it will now also trigger the Register Tag (sign up). Unless your forgot to deploy your new code, or forgot to set the correct .env variables, etc. — but if everything it set up correctly you’ll be able to see the ‘Sign up’ event in the Tag Manager preview mode.

After 24 hours (usually the next day), you can find the events in Google Analytics. You can see your tags in the preview mode but in Google Analytics they’ll show up a little later.

One more thing…

To use the custom user property inside Google Analytics, we have to define it.

Add a customer user scoped variable called User Type

Go to Configure > Custom definitions > create custom definition and add the name ‘User Type’ with the scope ‘User’ and the user property ‘user_type’. Make sure the user property ‘user_type’ is the same as you did set in your Tag Manager (it will be if you followed this tutorial).

The next day..

Open your Google Analytics and go to Events.

In the table below the graph you should be able to find multiple defaults events, but also your new sign up event.

By default it shows the metrics of all users. But with our custom user type metric (buyer and seller), we can now also filter on buyers and sellers. To add a new custom user scoped metric, click ‘Add comparison’ and select ‘User Type’. In the drop down below you’ll see a list of all possible options, if at least 1 user registered as buyer/seller, it will show the option buyer and vice-versa.