Vendure - Setting up facets

As mentioned in my very first article about Vendure, one of the most important things for me was the concept of facets.

In my use case, I needed custom elements for each product that the end users could filter.

For example, the beer shop I'm working on needs to have quite a lot of global fields:

Brewery
Type of brew
Alcohol percentage
And so on

Luckily for us, Vendure supported this out of the box, and in this article, I'll show you how to set it up.

Note: This involves more graphical interaction over development.

You can spool up your Vendure server and visit the admin UI at http://localhost:3000/admin/.

Move to Facets in the left sidebar menu; if you opt for the demo products, you'll see some already created facets.

Facets in Vendure

In the top right, you'll have the option to create new facets containing a name and optional code. Once you've chosen a name, you'll be able to add facet values. These are all the unique values for that facet.

I've created a Test facet with foo and bar values in the example below.

New facet

This is all great and well, but it doesn't do much. So we must move to one of our products to leverage these facets.

When you open a product, you should see on the right side there is a button to add facets. The important part to note here is that it searches based on the values, not the name.

I'm trying to add the Foo value in this case.

New facet to product

As mentioned in the Vendure import article, we can use an import to manage many products.

It's good to note that this also supports the import of facets!

How it works is that you define variantFacets as a column, and inside, you can column deliminate all the values like so:

test:Foo|test:Bar

This would add both the Foo and the Bar value. The test part is the code of the facet that we created.

This is super helpful in creating an excellent structured database with all my products organized with custom facets.

Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or Twitter

Vendure - Setting up facets

Comments

More from this blog

I wrote 1000 articles, what’s next?

Vendure community and more

Deploying Vendure

Vendure - Overwriting email templates

Customizing vendure

Manually creating facets

Importing facets

Thank you for reading, and let's connect!

Command Palette

Comments

More from this blog

Manually creating facets

Importing facets

Thank you for reading, and let's connect!