How do I install the Matomo Analytics tracking code on an HTML website? FAQ - How to

An HTML website is built using HyperText Markup Language (HTML), often combined with CSS for styling and JavaScript for interactivity. These websites consist of static or dynamically generated pages, requiring tracking scripts to be manually added to the website’s code.

Integrating Matomo with your HTML website enriches insights into visitor interactions, content performance, and website/app performance. This helps optimise content effectiveness, conversion drivers, visitor experiences and more! Before tracking, ensure compliance with data privacy regulations by obtaining user consent where required.

Requirements

Before proceeding, ensure you have the following in place:

New Users: Create your Matomo account (Cloud or On-Premise).
Current Users: You have superuser access to add a new website to an existing Matomo instance.
Choose your installation method: Matomo Tag Manager or Matomo Javascript tracking code.

Install with Matomo Tag Manager

Matomo Tag Manager (MTM) simplifies tracking by managing tags from a centralised platform. The default Matomo installation includes an auto-generated Tag Manager container with the key components required to start tracking.

Note: By default a tracking tag should already be in your Tag Manager for a new site. If you do not see a Matomo Analytics Tag, follow the steps below to add one.

Open Tag Manager and click the settings icon to configure your container.
Navigate to Variables and edit the Matomo Configuration Variable to include your Matomo URL and Site ID (for the website you want to track).
Navigate to Tags and verify the Matomo Analytics Tag is configured for default tracking and linked to the Matomo Configuration Variable and Pageview Trigger.
Publish the container.

Find the Tag Manager tracking code

In your Tag Manager container dashboard, navigate to Install Code.
Copy the code snippet to the clipboard as you will need to insert it into your website’s code.
Go to the section below to Embed the Matomo tracking code in the website pages.

Install using the Matomo JavaScript code

An alternative installation method is using the Matomo JavaScript tracking code, which can be customised to include additional tracking features, such as event tracking, custom dimensions, and goal tracking. For a full list of available tracking options and implementation details, refer to the Tracking JavaScript Guide.

Find the Javascript tracking code

Navigate to Matomo settings > Measurables > Tracking Code.
Select the website to track and copy the code snippet to the clipboard or paste to a text editor to modify the script as needed.
Go to the section below to Embed the Matomo tracking code in the website pages.

Embed the Matomo tracking code in the website pages

You will need to manually add the tracking code to each webpage you want to monitor.

Open your website in edit mode to access the HTML of each page where tracking should be implemented.
Paste the Tag Manager container code or Matomo JavaScript tracking code within the section, placing it as close to the top as possible. For example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

<!-- Paste Matomo Tag Manager code or JavaScript Tracking code-->
<script>
  var _paq = window._paq = window._paq || [];
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u="https://mywebsite.matomo.cloud/";
    _paq.push(['setTrackerUrl', u+'matomo.php']);
    _paq.push(['setSiteId', '1']);    
  })();
</script>
<script src="https://cdn.matomo.cloud/mywebsite.matomo.cloud/matomo.js"></script>
<!-- End Matomo Code -->

    <title>My Website</title>
</head>
<body>
    <h1>Welcome to My Website</h1>
    <p>This is a simple HTML page.</p>
</body>
</html>

Save and publish the changes to apply tracking to your website.

Validate the Integration Configuration

Validate the integration by verifying that tracking is active and data is being sent to Matomo as expected. When testing, make sure tracking is not blocked by consent settings, ad blockers, or browser privacy features.

Open your website and visit the pages containing the tracking code to test if Matomo captures your visit.
Navigate to your Matomo dashboard and view the Visits in real-time widget to verify your website visit appears in the log.
Use the browser’s developer tools > Network tab and filter for matomo.php, which indicates tracking requests are being sent.
For integrations using Tag Manager, confirm the Matomo Configuration Variable is correctly defined. Use the Preview and Debug tool to ensure the trigger fires as expected and activates the tag.

Troubleshooting

If no tracking data appears in Matomo, use the following resources to troubleshoot:

Next steps

For reporting and advanced tracking configurations, explore related topics:

Consent manager integration with the JavaScript tracking client.
Consent manager integration with Matomo Tag Manager.
Custom event tracking for specific user interactions.
Customise tracking with Matomo Tag Manager.
Create segments to analyse and compare datasets.

Discover additional resources in the knowledge base, developer guides and community forums.

Happy Analytics!

Disclaimer: The use of any third-party tools (plugins, extensions, platforms, APIs, widgets, etc.) is at your own risk. Matomo does not own, control, maintain or support any third-party tools that integrate with our product. We recommend checking your privacy setup is correctly configured across your environment when using any third party tools.

Next FAQ: How do I install the Matomo Analytics tracking code on Wix?

Previous FAQ: How do I install the Matomo tracking code on Drupal?