How to Setup Pageviews in Webflow?

Learn how to setup pageviews in Webflow with Flowmonk's pageview flow add-on. Step-by-step instructions to start syncing pageviews in real-time to Webflow.

We made it easy to enable real-time pageview count for Webflow with our pageview sync flow. This enables you to have real-time pageviews synced to Webflow's CMS for any Webflow collection list.

Step 1: Add New Site

If you haven't already setup your Webflow account with Flowmonk you'll need to click on the add New Site button at the top of the page. This will walk you through setting up your first Webflow site with Flowmonk.

Step 2: Add Flow

After you've setup your Webflow site with Flowmonk you'll now be able to add a pageview sync flow to your Webflow site. Click on the Add Flow button next to your website name in the Flowmonk dashboard.

Step 3: Select Item Pageview Totals flow

Select the Item Pageview Totals flow as indicated in the image below.

Step 4: Prepping your Webflow collections

At this point you are ready to map your fields so that we can begin to send Pageviews to Webflow. You will need to head into your Webflow site and create a new field for each collection that you'd like to have pageviews synced to.

Create a number field in your collection as shown in the image below:

Select the Number field type in your Webflow collection

Setup the number field, in our example we used FM - Views for the field name, you can choose whatever name you'd like for the field name.

Customize the Label and use whatever field name you'd like, in our example we used FM - Views. The format should be Integer as shown above.

Step 5: Mapping your fields with Flowmonk

At this point you are now ready to begin mapping the pageview fields to Flowmonk. This will allow Flowmonk to start sending your Webflow site updated pageviews for each Webflow collection item as they receive them.

Step 6: Add the Flowmonk pageview JS snippet to your Webflow site

In order for Flowmonk to start tracking new pageviews to your site you'll need to add our JS tracking snippet to your Webflow site. You'll now be presented with your tracking code as shown in the screenshot below. Be sure to copy the script from this screen, go to your Webflow's site settings and the custom code page and paste your script under the head code section. Be sure to save and publish your site. Once confirming we'll then make sure that the script is found on your site.

Step 7: Map remaining fields

Continue from step 2-5 to map your remaining CMS collections that you would like to have pageviews synced to.

Step 8: Publish your Webflow site

You need to make sure that you have published your Webflow site after mapping all of your pageview fields. Adding new fields to Webflow collections requires your site to be published (both staging and your custom domain). Flowmonk will continue to track your pageviews while your site has not been published, although any updates to the Webflow CMS will require the site to be published to allow for us to update the CMS items with the newly created fields.

If you utilize Google Analytics for your Webflow sites you can import Google Analytics pageview data via our import tool. This will sync all legacy pageview data so that moving forward your previous and new pageviews are all in sync.

Did this page help you?
for free
Create account