Doug Digital | Digital Marketing Expert

Analytics & data

How to add Google Tag Manager (GTM) script to a Pardot Landing Page in 5 Minutes or Less

Posted on .

How to add Google Tag Manager (GTM) script to a Pardot Landing Page in 5 Minutes or Less

Introduction

Add Google Tag Manager to Pardot Google Tag Manager Douglas

In this short article, I’ll walk you through how to add Google Tag Manager (GTM) to a Pardot landing page. The good news: this is going to be very easy, and it will require no developer to install.

If you’ve got a spare five minutes and the necessary permissions on each platform, it’s going to be a doddle and should take you no more than five minutes — at most!

How to find the Google Tag Manager Tracking Code

The first thing we’re going to need is our Google Tag Manager tracking code. To find this, we first need to head to the Google Tag Manager Website. Once there, you’ll need to login via your typical Google account that you used to access your Google Analytics and GTM data.

Once you’ve successfully logged into GTM and you have access to the account you’d like to connect, click ’Admin’in the top left. On the following screen, you’ll see a column for the GTM account and a column for the container. Under Container, click ’Install Google Tag Manager’

Screenshot 2022 04 28 at 11.31.41 pm Google Tag Manager Douglas

On the following page, you will see two tracking codes: the top code, the larger of the two, will be copied and pasted directly below the <head> tag on your Pardot’s landing page, while the second block of code will be copied and pasted directly below the <body> tag on your Pardot landing page. Don’t panic, this is very straight forward and will take no coding knowledge to implement.

Here is an example of the code we will be inserted below the <head> tag:

<!– 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-[YOUR CODE]’);</script> <!– End Google Tag Manager –>

Here is an example of the code we will be inserting below the <body> tag:

<!– Google Tag Manager (noscript) –> <noscript><iframe src=”https://www.googletagmanager.com/ns.html?id=GTM-[YOUR CODE]” height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript> <!– End Google Tag Manager (noscript) –>

Please above code blocks are for illustrative purposes only; you must copy the blocks that are in your Google Tag Manager account.

How to add the Google Tracking code to a Pardot Landing Page

Believe it or not, we’re already half-way there! Next, navigate in a new tab to the Pardot Landing Page Template that you will be using on your target landing page. We’ll want to leave GTM open as we will be copying the code shortly.

Below, I have a fresh Landing Page Template in Pardot, which has only a few lines of code. We can very quickly identify the <head> and <body> tags that we will to need to use since there’s so little text, but if you have an existing template, you can type CTRL+F on Windows or ⌘+F on a Mac to open the search window. Search for <head> and navigate to the very first instance — for the Head tag, this should be relatively high in the page template’s code.

Heaer Tag Google Tag Manager Douglas

Once you’ve found your <head> tag, return to the GTM window with your two code blocks and copy the top block by clicking the small ‘Copy’ icon in the top right, which looks like two stacks of paper.

Return to the <head> tag you located, place your cursor immediately after the > symbol, then hit Return on your keyboard. On the new line you’ve created, paste the code that you’ve just copied.

It should look something like this:

Screenshot 2022 04 29 at 12.42.13 am Google Tag Manager Douglas

Next, we’ll want to locate the <body> tag using the search function again. Once we’ve found, again we’ll hop back to the GTM page and this time we will copy the bottom code block.

Returning now to the Pardot landing page, we simply need to hit Return after <body> on the keyboard to create a new line, then paste in the code block.

It should like something like this:

Screenshot 2022 04 29 at 12.44.33 am Google Tag Manager Douglas

Finally, click save at the bottom right to save your code. The Google Tag Manager code has now been successfully added to your Pardot Landing Page.

If you use multiple landing page templates, you will need to repeat this process for each landing page template that you use.

You have now successfully added your Google Tag Manager script to your Pardot Landing pages.

If you have any questions, please leave them in the comments below.

Douglas

Douglas

https://blog.dougdigital.co.uk

I'm a digital marketing expert with more than 10 years experience in the biz! When I'm not working, I'm enjoying video games, playing with my dog Shadow and fawning over all things technology.

Comments
  • user

    AUTHOR Doug Digital

    Posted on 09:05 05/12/2022.
    Reply

    Having trouble with implementing the tracking code? Feel free to reach out!
    Just visit https://dougdigital.as.me/schedule.php and we can review your setup.

  • View Comments (1) ...
    Navigation