How do I install the Matomo Analytics tracking code on modern SharePoint Pages

The modern Script Editor is a web part that enables users to insert HTML, CSS, and JavaScript directly on modern SharePoint pages. While the Script Editor is available in classic SharePoint, it is not included by default in modern SharePoint sites. However, you can install this web part by uploading a SPPKG file, as described in this guide.

The use of any third-party tools, including plugins, extensions, platforms, APIs, and widgets, is at your own discretion, and you should ensure that this integration method aligns with your security and privacy policies. Matomo does not own, control, maintain or support any third-party tools that integrate with our product.
For support using the modern Script Editor, please contact the SPFx web parts development team.

Getting started

To implement tracking on your SharePoint pages, you should choose to use the Matomo Tag Manager (MTM) script. Using Matomo Tag Manager (MTM) is recommended over the JavaScript tracking code for modern SharePoint because it is easier to make changes to the tracking configuration.

With MTM, you can apply updates directly in the MTM interface without needing access permissions to edit SharePoint Pages. This flexibility also allows deploying custom HTML on specific pages, offering more control over tracking configurations.

This guide explains the integration steps using Matomo Tag Manager to track user interactions and gather insights on your SharePoint site/s.

Before proceeding, ensure you have the relevant permissions to access and edit your modern SharePoint pages.

Install the modern Script Editor web part in modern SharePoint

1. Click here to download the PnP modern script editor.zip file and extract the file contents to an accessible location.

2. Go to your Microsoft Admin centre and open Settings > Integrated Apps.

3. Click the SharePoint link (1) to open the advanced management page.
   

4. Open Apps > Appcatalog > Manage Apps page.

5. Click Upload and browse for the extracted .zip file content. Upload the SPPKG file.

6. Select the option, Enable this app and add it to all sites to be able to use the web part in multiple site collections, and then click Enable App.
   

7. The Script Editor web part should now be installed on SharePoint.
   

Set up tracking in Matomo Tag Manager

1. If your Matomo site is not set up for tracking, then add and configure a new website in Matomo. You can choose to install via Tag Manager.

2. You can set up A basic tracking configuration in a Tag Manager container by adding the Matomo tracking tag, Pageview trigger, and Matomo Variable. Note the Matomo Variable should refer to the SharePoint site with the correct Site ID.
   

3. Go to Tag Manager > Install Code and copy the code for your container that is displayed in the code block. Paste the code to notepad.

4. Publish the container to a live environment.

Add the Script Editor web part and MTM script to SharePoint pages

1. In your modern SharePoint site, go to Pages. Select the page where the tracking code will be executed.

2. Open the Page and click Edit.

3. In the page editor’s Toolbox, locate the Modern Script Editor web part you recently installed. Click on the web part to add it to the page.
   

4. To insert the tracking code, click the Edit markup button and paste the MTM script (copied earlier) in the Edit HTML Code block. Click Save.
   

5. Toggle the option to Enable classic spPageContextInfo.
   

6. Repeat these steps for each page that will contain the tracking code.

7. To test tracking is successfully initialised, open the modern SharePoint Pages with the web part included and view the Visits in real-time. Your pageviews should be tracked in Matomo.