How to add Google Tag Manager code in Genesis Theme without plugin

programmingFor some reason you don’t want to use or install plugin to upload the Google Tag Manager code in your website. WordPress Plugin is a piece of software program that adds additional new feature and functionality to your website. WordPress plugin is popular to users since it can be downloaded directly on WordPress.org plugin page for free and it does not need any coding experience to implement such additional feature.

Disadvantages of using WordPress plugin:

  1. Performance – Plugins are created using PHP, javascript and css files. This files and codes are added to the wordpress website which can slow the website speed and performance.
  2. Security – Some plugins are written poorly or haven’t updated for a long time. This plugins can easily hack your website or infected with malware.
  3. Website Crash – There are times that plugin conflicts with themes and other installed plugin causing your site to crash.

Installing Google Tag Manager code using functions.php

If you are hesitant to install a plugin due to disadvantages then this tutorial will help you install Google Tag Manager code on your website.

Add the following code to your child theme’s functions.php file.

add_action( 'wp_head', 'google_tag_manager_head');

function google_tag_manager_head() {
?>

<!-- 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-XXXXXXX');</script>

<!-- End Google Tag Manager -->

<?php
}

add_action( 'genesis_before', 'google_tag_manager_body' );

function google_tag_manager_body() {

if ( current_filter() == 'genesis_before' )

?>

<!-- Google Tag Manager (noscript) -->

<noscript><iframe
src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

<!-- End Google Tag Manager (noscript) -->

<?php

}

Google Tag Manager requires two set of code to be installed on your website. One code to be placed in the <head> area and the other one after the opening <body> tag. Just replace GTM-XXXXXXX with your GTM ID.

Leave a Reply

Your email address will not be published. Required fields are marked *