• Skip to primary navigation
  • Skip to content
  • Skip to primary sidebar
  • Skip to user navigation

PopWP

WordPress and Genesis Tutorials

  • Get Started
  • About
  • Archive
  • Services
  • Membership
  • My Account

Add Google Tag Manager code in Genesis

Last Updated on April 18, 2019 Favorited: 0 times

This tutorial provides the steps on How to add Google Tag Manager code in Genesis based child themes.

STEP 1

Go to https://tagmanager.google.com/ and log in with your Gmail account.

You will be redirected to the Tag Manager account.

STEP 2

Click on Create Account from the right top and fill the details

and Click “Create”.
Read and Accept the Terms of Service agreement and Click Yes.

STEP 3

A new Page with Pop up like this will appear. The first code is for javascript enabled browser and the other one will be used when Javascript is not available in the Browser.

Remember the GTM-XXXX id.

STEP 4

Open functions.php of your child theme and add the following.

//* Add Google Tag Manager code in <head>
add_action( 'wp_head', 'dy_google_tag_manager_js' );
function dy_google_tag_manager_js() { ?>

    <!-- 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','GTM-XXXX');</script>
<!-- End Google Tag Manager -->

<?php }

//* Add Google Tag Manager code immediately after opening <body> tag
add_action( 'genesis_before', 'dy_google_tag_manager_no_js' );
function dy_google_tag_manager_no_js() { ?>

    <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<?php }

Replace the sample code mentioned in the above function with the code provided by Google Tag Manager in STEP 3 or Replace GTM-XXXX with your container ID.

Output:

Reference: https://developers.google.com/tag-manager/quickstart

Related Posts

  • How to Add a new website in Google Analytics

Categories: Free Content, Genesis Tutorials Tags: Google, google tag manager

Reader Interactions

Comments

  1. Marcus says

    October 3, 2019 at 1:42 am

    Does it matter where you place the code in the functions.php file? Before any of the other code, or at the bottom, after all the code thats already in there?

    • Aryan Raj says

      October 5, 2019 at 12:24 am

      Hi, Pasting the code at the bottom ensure that we have not mixed the code. This also helps us to easy management, easier to find the custom code. Mixing codes with original theme code will make things complicated when you ever want to remove them.

Primary Sidebar

Search

WPEngine WordPress Hosting, Perfected.

Hosting You are looking for?.
Perfect solution for small business to global enterprise.

Learn more

StudioPress Genesis Theme Framework

The No.1 Theme Provider.
Creative, SEO rich Theme for all niche projects.

Learn more

Categories

  • Free Content
  • Genesis Tutorials
  • Premium Content
  • Snippets
  • What's New?
  • WordPress Tutorials

Tag Cloud

Archive Background Section blog canvas menu center logo columns conditional tags CSS CSS Grid custom Customizer custom post type Custom Post Types custom template Custom Widget effect eNews Extended Featured Image front-page Genesis Genesis Sample header right hero section Image Background js layout left menu Logo menu Navigation Menu newsletter post page related posts responsive menu search search widget Shrinking Logo site header slide in-out Stylesheet Template Utility Bar Video Background widgets WordPress

Built with Genesis Framework + WordPress by Aryan Raj

  • Contact
  • FAQ
  • Disclaimer
  • Privacy Policy
  • Copyright Policy
  • Terms of Service