Book free consultation
Book free consultation

Building dynamic CMS using Jetboost Webflow and creating a custom menu

written by

Sławosz Hodura

Webflow Freelancer at SoftwareSupport

The project aims to design an example Webflow collection page with dynamic filters for landing pages. The client wanted to narrow down the search results. Additionally, he needed technical support regarding specific elements of website development. Freelancer's work consisted of Webflow consultations about functions' usage and showing solutions to specific technical problems, such as adjusting the menu. Our customer knew his product well and its technological aspects. By purchasing an hourly plan, he gained access to a database of certified experts to hire them on-demand to handle his current affairs.

I am a Webflow expert and a web designer with a marketing background. I have passed SoftwareSupp internal exams and joined the project immediately after acceptance of the offer by the client. I have extensive experience working on Webflow projects. This project stood out from the crowd. I had to demonstrate the ability to impart knowledge. The client did not want to set up the entire website or complete technical tasks but wanted me to show him specific solutions that, after explaining them, he implemented himself to the website. - Sławosz Hodura, SoftwareSupp Freelancer

Webflow website modifications- project’s details

SmartOnes hired a certified Jetboost Webflow freelancer. This client is also from the IT industry, so he communicated with the specialist very smoothly. Daily, they deal with the sharing of digital tools. They support the latest trends and technological solutions.

Client's Jetboost Webflow website
Website captured on tutorial prepared for a client

Project time: 8h

Client: SmartOnes

Initial assumptions - Jeboost Webflow project

  • Discovery call
  • Demo of the concept & current Webflow pages
  • Setup Dynamic filter pages for Categories (active filter dynamically per category page only showing the collection's items for that category)
  • When there is a time- set up some more pages.
  • Some general advice.

Technical support for Webflow website development

The client needed Webflow technical assistance for two internal projects. The first one concerned the filtering option on the website. The problem was the inability to limit the search results before the user entered a phrase or selected a specific item. The goal was to filter out the elements within a given category. To show it on a simple example: if we are on a subpage about men's shirts and enter "winter boots", the search engine will not return any results, because winter boots are not included in the category of men's shirts.

Jetboost Webflow dynamic filtering
Categories for dynamic filtering

To achieve the project's goal, we had to combine the capabilities of Webflow with Jetboost. Jetboost filters were supposed to only search for products of a specific category, so we had to apply native filtering on Webflow for the category subpage. For example, inside the collection page category 'Mac', we clicked the filter: contains current- we received the products assigned to the 'Mac' category. To put it differently, every category like Mac, Android, Windows, etc., has an automatically assigned Webflow Native Filter that shows only items in this category. With these appropriate settings, Jetboots will only search for entries within a given section. The described manual settings can also be used in the following subpages. Filtering concerned SaaS solutions offered by the client.

It is also worth mentioning that the filters have not been introduced on the main page. The client wanted the user entering the website to be able to search for all available items.

Webflow settings for filtering
Webflow settings

The second part of the work focused on the client's website. It was created on a ready-made theme from the Webflow marketplace. He introduced most of the customization on his own. However, he needed help in adjusting the Menu. I assisted the client in solving the problem of displaying links and information about the company. We also worked together on the adjustment of the contact form. The form has a multi-stage structure - it consists of several dependent questions.

The client has a lot of technical knowledge. He could operate on a Webflow system, but he wanted to expand his skills. For most of the work, we worked together. Thus, he will know how to implement certain things in the future. Additionally, I created educational materials at the client's request. The videos show a sequence of steps that must be taken to implement or change a specific element on the page.

Within 8 hours, the client learned how to adjust the menu to his specific requirements and gained the necessary knowledge to set CMS dynamic filters himself. The purchased developer's working hours were used for software support. In other words, the client had access to individual Webflow consultations at any time, depending on the emerging questions or problems.

Setting of Jetboots on Webflow website
Jetboots on Webflow

Webflow developer’s tasks

  1. Examine the filtering problem
  2. Reproducing the problem and creating tutorials
  3. Design improvements on the website:
  • Menu

- Change contact details to the same in the footer

- Delete items 'Works'​,​ 'Case studies'​,​ 'Expertise'

- Delete social links

  • Contact page

- Change options in the blocks

- Join Community

- Pitch An Idea

- Get Expert Advice

- The step about Budget can go out

Jetboost Webflow CMS

Jetboost is a system that extends Webflow with advanced filtering functions. We can search various articles, catalogs, or products on the website with ease. Moreover, Jetboost can be seamlessly integrated with Webflow. The real power of this solution is dynamic filters. It means that when you add a category in the Webflow editor ( e.g. winter boots) and add products to this category - the filters on the website will automatically update. So the person maintaining the website does not need to have any technical knowledge because once configured filters will automatically adapt to new variables. Jetboost has several attractive functions. Using them, users can find interesting items on the website easily. For example, real-time on-page Search - the filter displays elements that match the content that the user has entered.

Jetboost also allows the combining of different filters with each other. We can click on the categories: winter shoes, and then inside the category we can select the tag: brown shoes, and then further narrow down our search by entering the word Adidas.

The implementation of the filtering function by Jetboots impacts the development of our website. Thanks to them, the search is carried out in real-time. Thus, we improves the user experience and increases page speed. Consequently, we increases conversions.

Jetboost also has several other useful functions. For instance, the load more button loads new details only when the user deems it necessary. It implies that all elements do not load at once, and thus the page loading time does not increase. Note that pagination and the load more button have been created not to overload the page, to let it works quickly and efficiently.
Jetboost is very lightweight and is considered the go-to solution for Webflow. An alternative solution is the CMS Filters system created by Finsweet. It is a free option and can be successfully used depending on the project requirements.

Dynamic filters settings in Jetboost Webflow
Jetboots Webflow - CMS Dynamic filters

After submitting the project, the client was introduced to the dedicated freelancer. Below we present the offer made by Sławosz. The offer includes the estimated time of project implementation and the price for the project assumptions specified by the client. Acceptation of the offer is the information for freelancers to start work. During this process, a customer gets access to expert's profile. It allows checking their experience and skills. The product makes it possible to start the workflow efficiently and contact the specialist at any time.

Offer for Jetboost Webflow website project
Offer prepared by Jetboost Webflow Specialist
Share Article

written by

Sławosz Hodura

Webflow Freelancer at SoftwareSupport

Order projects, hire with SoftwareSupport.

Book free consultation

You might also be interested in these