Best way to handle filtered listing pages in Hugo?

support
1

Hi everyone,

I’m building a product listing site in Hugo and trying to decide the right approach for filters.

My current idea

At build time, I generate folders for valid filter combinations using a script.
Each folder has an _index.md.

Example structure:

/city/
/city/brand/
/city/price/
/city/brand/product/
/city/brand/price/
/city/brand/product/price/

Other filters are handled using client-side JSON filtering (Svelte).

My question

Is this a good approach in Hugo?

If not, what is the correct or recommended way to handle filters in Hugo without creating too many folders/pages?

Stack

  • Hugo
  • Svelte
  • JSON data
2

Depending on the frequency of changes to your data and their amount, a static site generator might not be the best tool. Rebuilding a sure just because a price changes does not immediately strike me as an easy approach.

3

Thanks for the input.

Our data does not change very often. We add listings in batches, so rebuilds are fine for us. We will continue using Hugo + Svelte.

One clarification about price — we are not storing exact prices in folders. Instead, we use fixed price ranges like:

/upto-5-lakh/
/5-to-10-lakh/
/10-to-15-lakh/
/above-15-lakh/

So when a price changes, it does not create or delete folders. It only moves the listing from one price range to another, which triggers a rebuild like any normal content update.

Right now, our main concern is scale. If we have many cities, brands, and products, this approach will create a very large number of folders and files.

Given this, is creating a folder for each filter combination a good long-term approach? Or is there a better Hugo-native way to handle this without creating too many folders as the data grows?

4

Use Taxonomies to do some lifting for you. .

5

I was already using URL queries, but they didn’t support multiple filters properly. Because of that, I switched to pre-generated pages.