# Best practice for adding GTM tracking snippet to Sage 9 theme

**URL:** https://discourse.roots.io/t/best-practice-for-adding-gtm-tracking-snippet-to-sage-9-theme/23002
**Category:** sage
**Tags:** sage9
**Created:** 2022-04-28T09:31:36Z
**Posts:** 4

## Post 1 by @ushka — 2022-04-28T09:31:36Z

Hello,

I’m looking to setup GTM on a few sites I have running Sage 9.

When you setup GTM, they advise to add x2 JS tracking snippets, one as high up in your as possible, and the other just after the opening tag.

My initial thought is, just add the tags directly to the `partials/head.blade.php` and `layout/app.blade.php` files and be done with it. Is this a sound approach?

Since these scripts don’t have dependencies, I don’t see what advantage I’m getting by using `wp_enqueue_script`, unless its more performant that the scripts be enqueued because they can be cached more optimally?

Using a plugin to do this seems like overkill, I’m aware of the plugins (but they seem to add a lot of additional cruft):

> **[Google Tag Manager for WordPress](https://wordpress.org/plugins/duracelltomi-google-tag-manager/)**
>
> Advanced measurement/advertising tag management and site personalisation for WordPress with Google Tag Manager and Google Optimize

> **[Site Kit by Google – Analytics, Search Console, AdSense, Speed](https://wordpress.org/plugins/google-site-kit/)**
>
> Site Kit is a one-stop solution for WordPress users to use everything Google has to offer to make them successful on the web.

On a side note, I’m also curious if the approach would still hold for Sage 10 themes if I look to upgrade in the future.

---

## Post 2 by @matheus.digital — 2022-08-09T23:35:46Z

Hi dear, it’s a please for me in first time answering something here, while being also the first to answer your question.

I think the solution I’ll propose here is better than what you have mentioned, but I don’t know if this is really the best one. I’ll share it and let’s see what the community experts say.

In the **theme/functions.php** file, find the line where it loads/register the “setup” and “filters” php files, add a new one, let’s call it “ **analytics** ”, so that block of code will look like this:

```
collect(['setup', 'filters', 'analytics'])
    ->each(function ($file) {
        [...]
```

Then, I created an environment variable called “GTM\_ID” on my .env file:

```
#GOOGLE TAG MANAGER (GTM) ID
GTM_ID=GTM-XXXXXX
```

And finally, our analytics.php file, that includes the scripts required, on **wp\_head** and **wp\_body\_open** using add\_action, loading the GTM\_ID from the .env file:

```
<?php

/**
 * Analytics helpers.
 */

add_action(
  'wp_head',
  function (): void {
    if(getenv('GTM_ID')){
      ?>
      <!-- Google Tag Manager -->
      <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
      new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
      j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
      'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
      })(window,document,'script','dataLayer','<?= env('GTM_ID')?>');</script>
      <!-- End Google Tag Manager -->
      <?php
    }
  },
  1,
  0
);

add_action(
  'wp_body_open',
  function (): void {
    if(getenv('GTM_ID')){
    ?>
      <!-- Google Tag Manager (noscript) -->
      <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=<?= env('GTM_ID')?>"
      height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
      <!-- End Google Tag Manager (noscript) -->
      <?php
    }
  },
  1,
  0
);
```

Hope this get you to a good point! :slight_smile:

Thanks,  
Matt.

---

## Post 3 by @ushka — 2022-11-07T07:21:34Z

Hi Matt,

Thanks for responding. Curious to know why you think this solution is better?

is it better because its more flexible if you want to add more layouts? or is it more performant? genuinely curious what is the difference between using the add\_action vs. just creating x2 Blade partials (`head-gtm.blade.php` and `body-gtm.blade.php`) an adding to my layouts accordinly.

---

## Post 4 by @Koli14 — 2023-08-03T12:08:49Z

Thanks for the solutions!  
It’s important, that your `app.blade.php` contains this peace of code after the `<body>` open:

```
@php wp_body_open() @endphp
```

And your `head.blade.php` this peace of code:

```
@php wp_head() @endphp
```
