Filtering and adding products to a collection

Hey everyone,

I’m looking at getting into webflow to build prototypes and then possibly launch a new website if successful for a client. I’m looking at recreating this website Outback Armour but can’t find any information on building that search function drop down menu at the start, especially how when you select one option it filters the next box etc. Is this possible to make via webflow?

Also for anyone that has dealt with similar data in the past, each vehicle has different part numbers/models so they all seem to lead to their own page. I’m assuming I’ll have to use CMS for creating all these pages automatically but would anyone know what the Excel spreadsheet would look like containing all this information? I want to create it in a way that is easy to change prices of similar items in the future but also keep their individual part numbers on each page.

If some one could take a quick look at the website I want to recreate and tell me if the functions are possible to replicate in webflow it would be great help from any experience webflow user. I’ve only been able to see staff member cms tutorials at the moment understanding that process being the same for all these products.

As you can see each vehicle have different part numbers next to the prices but for all the same type of products the prices remain the same across all models however some vehicle models have different products available etc.

as you can see these 2 pages are very similar in design layout but information is different on either page and have different products available.

Toyota vs Nissan

ANY HELP would be greatly appreciated, I hope this is something that is possible to do and wouldn’t mind paying someone who is able to show me an example of this being done with other similar data. These things are hard to practice when you don’t have the time to get your hands on or build a excel document full of data you want to convert onto web pages.

thanks for your time

Hello @Jed141

The website you’re trying to build is perfectly doable in Webflow, the way you can do it is through collections and referenced collections. I know it can be done because I helped another person to build an online catalogue like the one you’re trying to build but for padlocks.

She had thousands of products but we were able to pull it off with Webflow CMS and a LOT of referencing. Unfortunately I’m not able to share the project for privacy reasons but I can assure you this can be done.

Let me know if you need any further help.

1 Like

Hey mate,

thanks for the reply,

Did this person have all her products/data in a excel sheet? I’m just a bit confused at how the layout would look of the excel sheet. Or if I knew how to make it I could request for each product to be layed out like that prior to building the website so the content is there for me. I just not sure if there is a way to automate all pages after just doing one with other collection data.

so reference the first page with the correct layout and data filled in and then copy the pages and run a button that would then automatically change all the other information, if you click on each of the links on the website I linked you, you can see in the URL that they all have their seperate pages for each product for each car make and model. Even with CMS, if I had 100 vehicles to do with over 20 products for each car that’s 2000 pages I have to manually go through and enter where the cms data goes.

I’m not sure if this is making sense or not but I am just worried making something like this would be very time consuming

Yes it does completely. Do you have an example of the data you want to have on the website maybe I can take a look at it and maybe I can help you mapping the file.

@aaronocampo realistically there’s probably about 10 car brands each with a average of 4 models that the shop sells products for.

So I was thinking is the correct way to make a excel document for each car model (40 excel sheets) containing all the products for their vehicles inside of that excel sheet layed out in tables. Does that mean I would then have 40 different collections to choose from? only problem is how do I reference each product to another page that talks about that product for ALL those pages. I see that you can choose a link from category that you upload but how do you link a page that hasn’t been created by webflow yet?

for example on the website I’ll choose 2 different vehicles - 2 of many vehicles that i would have to do.

first is this vehicle Nissan and the other Ford

if you compare those 2 pages they both have very similar products available for the models however, the part numbers are different. When you click on any of the products it then travels to another page that displays it’s own unique information on that page. This makes me think that I’m going to have to make thousands of pages since each vehicle has different variations of products available and when you click on the product it then travels to another page where it talks about that product.

If I was to get the company to collect the data into a document/excel sheet would that be the best way to do it, if so how would you recommend I get them to lay that information out? I sort of want to be able to change bulk information in the future so if their product name needs to change I only need to update it in one document instead of moderating multiple documents.

Ok, a couple if things here.

First of all, there is no way to make bulk changes in Webflow at the moment so you might want to consider that before anything.

On the other hand if you manage your products through collections and references inside Webflow you would be able to make those changes easier.

The reality is that you only need one csv file wich will contain all of the products you need.

Hey mate,

Sorry I’m just very confused and have no idea how I would lay out a document that has multiple products made for different vehicles and then also information to go along with those products. I think I need to gather 4 data from 4 vehicles and post the excel sheet in here to see if it is layed out in excel correctly cause I’ve never done or set up something like this before. So let’s just say I wanted to change the price of something that is the same across multiple products but these products are all called something slightly different, is that possible or would they all have to be labelled the same product to change the price. Is it possible to make changes in the excel document and then re import the data to update it so I can use functions such as search>replace all in excel incase I want to update price or change the name of a product spread across multiple vehicles?

Maybe you’re over thinking this. It’s just a matter of having a spreadsheet with the list of products like this:

This is just a general idea of what your collections and spreadsheet can look like, I know there is more to it but this is just the basic idea.

1 Like

Hey mate,

So if it set it up like this and had 40 different models does that mean I would then have to duplicate a page after I had filled the input with it and then select a different collection to fill the next page? Also if I wanted to go back and change the price within cms program does that mean I would have to change each individual price? If I go through and collect some data over the next couple of weeks would you be willing to screenshare/Skype to show how something like this is then implemented? I can pay a hour rate or something like that.

Hey mate so, I’ll attach the image below of content I’ve gathered from 2 pages so far.

One page being this model Ford and the other page being this model Nissan

with the information below, the red section is one vehicle and all that information needs to be displayed on one page and the blue is the other vehicle and all that information needs to be displayed on another page. I’m just a bit confused because all the tutorials I’ve watched out there so far whenever a new row is made in excel, webflow creates a seperate page for it.

does this look like the right setup to you?

Yes that looks right.

Every single product will have it’s own page BUT you can add a collection of products red/blue to a page like Nissan or Ford, etc.

Each record has to be modified independently yes.

Definitely, send me an email to aaron@ipagroup.co

Oh alright but how would I set that up on a single page

Which part are you talking about?

I see in the videos on YouTube this layout usually creates separate pages for each row but I was wandering how to put the red section on one page and the blue section on the other because there’s probably another 30 sections I would have to do that I want automatically made through cms, some of the car models have the same products for their vehicles some don’t have them available but they all have individual skus on them
So for example a Nissan navara would have a suspension kit called suspension trail with a sku of oa8900 and a Ford ranger would have a suspension kit called suspension trail but with a sku of oa4328(random product numbers for example) I’m very confused but would be willing to pay if you had time in the next couple of weeks to screenshare and set up the very basic page to show how it can be done as in no graphics but just setting up the text boxes to show how it’s all automated. If I gather more data in an excel sheet and have it set up like how you’ve seen to prepare it prior to the call you can utilise the data I’ve prepared to show me so I have a better understanding. If this is something that you’re confident with and sounds like something you’d want to do I can definitely pay for this service too I’d just need more time to gather the excel sheet data so there are more variables in it. I’m not asking you to make a full website but to just show how to remake that layout automatically by doing the very minimum so not including nav bar/graphics but just the information fields. I don’t think this would take any longer than 1 or 2 hours to explain if that. Sorry I’m very new to this but it’s the only thing that I don’t understand thst is holding me back from using webflow

Shoot me an email and we can discuss it there.