Graphed LogoGraphed
Graphed LogoGraphed
FeaturesUse CasesIntegrationsPricing

How to Add Google Analytics to Website HTML

Cody Schneider••9 min read

Adding Google Analytics to your website starts with a single piece of JavaScript code. Getting that code into your site’s HTML correctly unlocks a treasure trove of data about your visitors - what pages they look at, where they come from, and what actions they take. This guide will walk you through exactly how to install your Google Analytics tracking code, from the classic manual method to easier, platform-specific approaches.

First Things First: Get Your Google Analytics Tracking Code

Before you can add anything to your website, you need the actual code. This code snippet, officially known as the Global Site Tag (gtag.js), is unique to your website property. If you've already set up Google Analytics 4, you can skip to grabbing your code. If you're starting from scratch, here’s how to create a property and find your tag.

Step 1: Create a Google Analytics 4 Property

If you don’t have an account, Google will guide you through creating one when you first visit the Google Analytics homepage. If you have an existing account (perhaps with an older Universal Analytics property), follow these steps to create a new GA4 property:

  1. Log in to your Google Analytics account.
  2. Click the Admin gear icon in the bottom-left corner of the page.
  3. In the Property column, click the + Create Property button.
  4. Give your property a name (usually your website's name), and select your reporting time zone and currency. Click Next.
  5. Provide some basic business information. This helps Google tailor your reporting experience. Click Create.

Step 2: Set Up a Web Data Stream

Once you create a property, you need to tell Google Analytics where to collect data from. In this case, it’s your website.

  1. Under Choose a platform, select Web.
  2. Enter your website’s URL (e.g., mysite.com) and give your data stream a name (again, your website name is a good choice).
  3. Click Create stream.

Step 3: Find and Copy Your Global Site Tag (gtag.js)

After creating the data stream, a new window will pop up with installation instructions. This is where you find your code.

  • In the Installation instructions window, click Install manually.
  • You will now see a box with a JavaScript code snippet. This is your Global Site Tag.

It will look something like this. Be sure to copy the entire snippet.

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
  window.dataLayer = window.dataLayer || [],
  function gtag(){dataLayer.push(arguments),}
  gtag('js', new Date()),

  gtag('config', 'G-XXXXXXXXXX'),
</script>

The G-XXXXXXXXXX part is your unique Measurement ID. Keep this code handy, as you'll need it for the next steps.

Method 1: Manually Adding the Tracking Code to Your HTML

This is the direct approach, ideal for static HTML websites or custom-built sites where you have full access to the source code. The goal is to place the Global Site Tag on every single page you want to track.

To do this without repeating yourself, you'll need to add it to a common file that is included on every page, like a header template.

Understanding the <head> Element

Every HTML document has a <head> section. This section contains metadata about the page - information that isn't displayed on the page itself but is important for the browser and other services (like Google). This is where the Google Analytics snippet belongs, as it needs to load early to capture accurate visitor data. The code must be placed before the closing </head> tag.

Step-by-Step Instructions

  1. Locate your core site files. Connect to your website’s server using FTP or your hosting provider's file manager. You’re looking for the file that controls the header on all your pages. Common filenames include header.php, header.html, or index.html (for single-page sites). This ensures you only have to paste the code once.
  2. Make a backup. Before editing any core file, download a copy of it to your computer. If something goes wrong, you can simply re-upload the original.
  3. Open the file. Use a plain text editor (like Notepad on Windows, TextEdit on Mac, or a code editor like VS Code) to open the header file you located.
  4. Paste the tracking code. Scroll down until you find the closing </head> tag. Just before this tag, paste your full Global Site Tag snippet that you copied from Google Analytics.
  5. Save and upload the file. Save the changes to the file and, if you’re using FTP, upload it back to the server, overwriting the old version.

That's it! The GA tracking code is now installed across your website.

Method 2: Using Google Tag Manager (The Recommended Approach)

While editing HTML directly works, it’s not the most flexible or modern solution. A slightly better way is to use Google Tag Manager (GTM). GTM is a free tool that acts as a container for all your tracking-related codes (tags), including Google Analytics.

You add the Google Tag Manager container snippet to your HTML just once. Then, you can add, remove, or modify your Google Analytics tracking tag (and others, like Facebook Pixel or Google Ads tags) through the GTM interface - no more editing website code!

  1. Set up a GTM account and container. Go to the Google Tag Manager website, create an account for your business, and then a new container for your website domain.
  2. Install the GTM container on your site. GTM will give you two code snippets. One goes high in the <head>, and the other goes just after the opening <body> tag. Follow the same "Method 1" steps to place these snippets in the correct core file. This is the only time you'll need to touch your site's code for tags.
  3. Create a new Tag in GTM. Inside your GTM container, go to Tags and click New. Give it a name like "GA4 Configuration."
  4. Configure the Tag. Click on Tag Configuration and choose Google Analytics: GA4 Configuration as the tag type.
  5. Enter your Measurement ID. In the "Measurement ID" field, paste the G-XXXXXXXXXX ID from your Google Analytics data stream.
  6. Set the Trigger. Click on Triggering and select All Pages - Page View. This tells GTM to fire the GA tag on every page that loads.
  7. Save and Publish. Save your tag. Before making it live, you can use GTM's "Preview" mode to test that everything works correctly. Once confirmed, hit the Submit button to publish your changes.

Now, Google Analytics is running through GTM. The major benefit is that future tracking needs can be managed entirely from the GTM dashboard.

Method 3: Options for Platforms Like WordPress and Shopify

If you're using a Content Management System (CMS) or e-commerce platform, there's often no need to edit HTML directly. These platforms provide easier, purpose-built integrations.

WordPress Users

For WordPress, the simplest method is to use a plugin. The official plugin is Site Kit by Google, but many SEO and analytics plugins also have this functionality.

Using a Plugin (Google Site Kit):

  1. From your WordPress dashboard, navigate to Plugins > Add New.
  2. Search for "Site Kit by Google" and click Install Now, followed by Activate.
  3. Click the Start Setup button that appears. You'll be prompted to sign in with the Google account that manages your Google Analytics property.
  4. Follow the steps to grant permissions and connect your Analytics property. The plugin places the required code on your site for you.

Shopify Store Owners

Shopify makes this incredibly simple with a dedicated field for your Measurement ID.

  1. From your Shopify Admin dashboard, go to Online Store > Preferences.
  2. Scroll down to the Google Analytics section.
  3. Paste your Measurement ID (G-XXXXXXXXXX) into the field. Shopify does not need the full JavaScript snippet, just the ID.
  4. Click Save. Shopify will now automatically add the necessary GA4 tag into your theme’s HTML.

Other builders like Squarespace and Wix offer similar integrations. Just look for "Marketing Integrations," "Code Injection," or "External APIs" in their settings menus.

How to Verify That Google Analytics Is Working

After you’ve added the code, you need to confirm that it's firing correctly and sending data. Here are three quick ways to check.

1. Check the Realtime Report

This is the simplest way to see if your data is flowing to Google Analytics.

  • Open your Google Analytics property and navigate to Reports > Realtime.
  • In a separate browser window (preferably an incognito one), visit your website homepage.
  • Within minutes, you should see your visit appear in the Realtime report. If it does, your setup is working!

2. Use Browser Developer Tools

For a more technical confirmation, you can check if your browser is sending the tracking data.

  • On your website, right-click and choose Inspect to open Developer Tools.
  • Go to the Network tab.
  • In the filter box, type collect.
  • Refresh your webpage. You should see one or more network requests appear with a name that includes "google-analytics.com." If they have a "200" status, it means the request was sent successfully.

3. Use Google's Tag Assistant Extension

Google's legacy Tag Assistant Chrome extension is a handy tool that scans the page for Google tags.

  • Install the extension and navigate to your website.
  • Click the Tag Assistant icon in your browser toolbar and click Enable.
  • Reload the page.
  • Click the icon again. It should show your Global Site Tag (gtag.js) with a green or blue icon, indicating it has fired successfully.

Final Thoughts

You’ve taken a foundational step in understanding your website's performance by adding Google Analytics to your HTML. Whether you chose to edit the files manually, use Google Tag Manager, or leverage a built-in platform integration, you are now collecting the raw data needed to make much smarter decisions.

However, once that data starts piling up, the next question is how to make sense of it all without spending hours digging through reports. At Graphed, we help you connect all your data sources - like Google Analytics, Shopify, and Facebook Ads - into one place. You can then ask questions in plain English, like "Show me my top traffic sources by sales revenue," and instantly get back dashboards and insights. Our AI-powered platform turns your data into clear answers, helping you spend less time crunching numbers and more time acting on what matters. Give Graphed a try and see how easy data analysis can be.

Related Articles

How to Connect Facebook to Google Data Studio: The Complete Guide for 2026

Connecting Facebook Ads to Google Data Studio (now called Looker Studio) has become essential for digital marketers who want to create comprehensive, visually appealing reports that go beyond the basic analytics provided by Facebook's native Ads Manager. If you're struggling with fragmented reporting across multiple platforms or spending too much time manually exporting data, this guide will show you exactly how to streamline your Facebook advertising analytics.

Appsflyer vs Mixpanel​: Complete 2026 Comparison Guide

The difference between AppsFlyer and Mixpanel isn't just about features—it's about understanding two fundamentally different approaches to data that can make or break your growth strategy. One tracks how users find you, the other reveals what they do once they arrive. Most companies need insights from both worlds, but knowing where to start can save you months of implementation headaches and thousands in wasted budget.