Automatically track searches in Webflow in a few clicks

Why track searches in Webflow?

Searching makes it easier for your users to find the information that they need. When a user wants something, they may navigate around your site trying to find it but a lot of the times it's easier to just search and quickly get results based on what they're looking for.

Unlike tracking link clicks or button clicks, searches don't tend to be key actions users need to take to get value from your site. But by tracking searches you can learn a lot from your users. When a user searches for something, it's likely they came to your website with a specific purpose in mind.

By knowing what those search terms are (and tracking the most common terms), you'll get an insight into the content or features users are looking for. Doing this will help you come up with more engaging content. The fun part of doing this in Webflow is you can add search to a collection list to help people find something specific (use Jetboost's real-time search for this and make your life a lot easier!).

How exactly can this help you increase engagement? Here are a few examples:

• Job board: add a search box and learn what jobs, locations or industries people look for. Now you can add more jobs and tailor your content around some of the most commonly searched terms. This makes it easier for people to find what they want, more likely to click on a job as well as come back to your site in the future.
• SaaS marketing site: add a global search box or on a features page and you'll start to get an idea of the features people are looking for. If you already have that feature, you can grow your organic traffic by creating articles or pages specifically focused around that feature. If you don't have a feature that's searched for a lot then why not build it!
• Community: add search to your community to understand the topics people are interested in. Maybe there's a specific topic that comes up a lot? Great! You could turn that into a separate category in your community so people can more easily find it.

These are just some of the ways you could use the information you get from tracking searches. Now let's move on to actually implementing the tracking.

How to track searches in Webflow

Tracking searches in Webflow is really simple when you use Nocodelytics.

1. Decide what you want to track

You might know exactly which searches you want to track in which case you can move onto the next step.

If you're unsure, look at pages on your site which get a lot of traffic and have search box. The more traffic you have the better as this will give us a larger pool of users to get results from.

If you don't have any search box on your site, here are a few ways you can use search:

• On a collection list to let people easily find what they want (Jetboost's real-time search is great for this!)
• In your navigation or footer to allow people to search across your entire site. Webflow has a tutorial on how to do site search.
• In e-commerce to allow people to quickly find products.

Let's run through an example.

In this case, we have this website which is a directory of space startups. On the "Startups" page we have a search box that helps users filter through the main collection list on the page.

We're going to set up tracking for this search box.

So now that we know what we want to track, let's set it up in Nocodelytics.

2. Track the search box in Nocodelytics

Now let's go to the dashboard in Nocodelytics, select "New metric" and add pick the "Searches" option from the dropdown. We'll need the class of the form we want to track.

How do you find this class in Webflow? It's simple!

1. Go to the Designer and select the "Style" tab in the Right Side Panel (if it isn't already selected).
2. Below "Selector" you'll see a box with a laptop icon.

This search box uses Jetboost so I've just taken that class.

If you don't see any values in the class field, this means no class has been given to this yet. No problem! Just enter a new class in the Selector box. Use something that is both unique and descriptive.

Give your new metric a name so you know what it's for then hit "Save to dashboard".

3. See results

Once you've saved your metric, you'll see it added to your dashboard.

In just a few minutes, we've set up the metric to track searches on this form. Bonus! If you have previously set up Nocodelytics and use an existing class, you'll see historical data!

‍