How do I install the Matomo code on Webflow

Webflow is a web design tool, CMS, and hosting platform. The Matomo tracking code will need to be added to your Webflow site via the embed code element. Webflow allows you to add the tracking code sitewide or per page. We will discuss both methods below.

You will need a paid webflow.com account and your Matomo instance (Self-hosted or Cloud).

Integrate Matomo with Webflow (site wide)

1.Copy Matomo Tracking Code, follow the steps below:
a. Login to Matomo
b. Click on “Admin (cog icon)” on the top right of your dashboard
c. Click on “Manage” under “Measurables”
d. Click on “View Tracking Code”
e. Scroll down and copy JavaScript tracking code
2. Login to your Webflow designer.
3. Select Project settings from the top left nav menu.

4. Select Custom Code from the horizontal nav bar.

5. Paste your tracking code into the Head Code textbox.
6. Click save changes.
7. Publish the changes.
8. Login to Matomo and check if the page is tracked in the report Visitors > Visits log.

Integrate Matomo with Webflow (per page)

You may want to run specific tracking requests based on the page your visitor is on. For example an event to trigger a goal.

Please use the procedure below to achieve this.

1. Login to your Webflow designer.
2. Choose the pages icon from the left nav menu.
3. Click the gear on the page you want to add the code to.
   
4. Scroll down the right-hand panel to Custom Code
   
5. Add any additional page specific code. For example, you may want to add an event on this page.
   NOTE: Typically you would not add the tracking code here as well as site wide.
6. Publish the changes.
7. Login to Matomo and check if the page is tracked in the report Visitors > Visits log.
   

Congratulations, you should now be successfully tracking your visitors on your Webflow website. Happy Analytics!