How to Add Google Tag Manager to Your Ghost Blog
To publish the guide on your Ghost blog with all the necessary formatting, you can copy and paste the text below directly into the Ghost editor. The markdown headings, lists, and bold text are already included.
How to Add Google Tag Manager to Your Ghost Blog
Are you looking to get more out of your Ghost blog? Implementing Google Tag Manager (GTM) is a fantastic way to track your audience's behavior, manage third-party scripts, and supercharge your analytics—all without constantly editing your theme files.
The good news is, adding GTM to a Ghost site is a straightforward process, thanks to the platform's built-in Code Injection feature. Here’s a simple, step-by-step guide to get you up and running.
Step 1: Grab Your GTM Code Snippets
First, you'll need to create a Google Tag Manager account and a new container for your blog if you haven't already. Once that's done, GTM will provide you with two unique code snippets:
- A
<head>snippet, which should be placed as high as possible in the<head>section of your site. - A
<body>snippet, which needs to be placed immediately after the opening<body>tag.
Keep these two snippets handy, as you'll be using them in the next step.
Step 2: Use Ghost's Code Injection
Ghost’s admin dashboard has a powerful feature for adding custom code without touching the theme's core files. This is exactly what we'll use for GTM.
- Log into your Ghost admin dashboard.
- In the left-hand menu, click on Settings.
- Scroll down to the Advanced section and select Code Injection.
You'll see two text areas: Site Header and Site Footer.
- For the
<head>snippet: Copy the first GTM code snippet and paste it into the Site Header field. This ensures the code is loaded on every page, just before the closing</head>tag. - For the
<body>snippet: While GTM recommends placing this snippet immediately after the opening<body>tag, Ghost's Code Injection feature only provides a Site Footer field, which places code right before the closing</body>tag. This is a standard and acceptable workaround for Ghost users. Simply paste the second GTM code snippet into the Site Footer field.
- Click the Save button in the top-right corner.
Step 3: Verify Your Installation with Tag Assistant
After saving your changes, it's essential to make sure everything is working correctly.
- Go back to your Google Tag Manager workspace.
- Click the Preview button.
- A new window will pop up. Enter the URL of your Ghost blog and click Connect.
This will open your website in a new tab with the Tag Assistant debug console at the bottom of the screen. If you see your container ID listed and the status shows "Connected," you've successfully installed Google Tag Manager on your Ghost blog. You can now start adding and managing all your tags, triggers, and variables directly from the GTM interface.
