Add gender as product attribute

Add a product's gender as a taxonomy attribute making it possible to filter a product list based on its gender.

In this article

Example of a gender filter

Add gender attribute

Before you begin, the Gender attribute must exist. To add it, go here WordPress Admin Area > Products > Attributes and add Gender in the "Name" field and gender in the "Slug" field.

Add 'Gender' as an attribute.

Use a single field for attribute

In this example, we will choose one field from the product's list of fields and store that field as the gender attribute.

1

Identify the field

We can view all fields by clicking a product's name on the add/edit Product Sets pages in your WordPress Admin Area. We see that this product does have a "gender" field so we will use that.

Example of a product's gender field
2

Create a custom plugin

If you haven't done so already, create a custom plugin.

3

Add custom code

Add the following code to your custom plugin file.

4

Add/Update product sets

These changes will only take effect after any new Product Sets are created or after existing Product Sets are updated.

5

Expose filter as widget

Go here WordPress Admin Area > Appearance > Widgets and add a WooCommerce Layered Nav widget to your sidebar and configure it to display the gender attribute like this:

Add gender widget

Use multiple fields for attribute

Sometimes merchants store product information in different fields than other merchants. For example, some merchants will store the product's gender in the "gender" field while others will use a different field. In this example, we will use multiple fields to get the product's gender.

1

Identify the fields

We can view all fields by clicking a product's name on the add/edit Product Sets pages in your WordPress Admin Area. We see that this product does not have a "gender" field however it does have a field named extratexttwo which contains the product's gender. So we will use that field if the "gender" field does not exist.

Product without a gender field but with another field containing gender value
2

Create a custom plugin

If you haven't done so already, create a custom plugin.

3

Add custom code

Add the following code to your custom plugin file.

4

Add/Update product sets

These changes will only take effect after any new Product Sets are created or after existing Product Sets are updated.

5

Expose filter as widget

Go here WordPress Admin Area > Appearance > Widgets and add a WooCommerce Layered Nav widget to your sidebar and configure it to display the gender attribute like this:

Add gender widget

Use controlled vocabulary with one field

In the above examples, we rely on the names the merchants have provided for their product genders. But this can sometimes lead to unexpected results like this:

Gender names not using a controlled vocabulary.

In this example, we will provide a controlled vocabulary to ensure we have an organized gender attribute filter.

Before and after using a controlled vocabulary.
1

Identify the field

We can view all fields by clicking a product's name on the add/edit Product Sets pages in your WordPress Admin Area. We see that this product does have a "gender" field so we will use that.

Example of a product's gender field
2

Create a custom plugin

If you haven't done so already, create a custom plugin.

3

Add custom code

Add the following code to your custom plugin file.

Notice we have provided a list of terms that should be associated with the main term (ie. gender) that we want to use in our gender filter.

4

Add/Update product sets

These changes will only take effect after any new Product Sets are created or after existing Product Sets are updated.

5

Expose filter as widget

Go here WordPress Admin Area > Appearance > Widgets and add a WooCommerce Layered Nav widget to your sidebar and configure it to display the gender attribute like this:

Add gender widget

Use controlled vocabulary with multiple fields

This is useful when a merchant provides the product's gender in a field other than "gender" or if a merchant only provides the gender in the product's name. Using a controlled vocabulary on a variety of fields, we can extract the data we need!

1

Identify the fields

In this example, we will use 3 fields: gender, extratexttwo and name in that order.

2

Create a custom plugin

If you haven't done so already, create a custom plugin.

3

Add custom code

Add the following code to your custom plugin file.

4

Add/Update product sets

These changes will only take effect after any new Product Sets are created or after existing Product Sets are updated.

5

Expose filter as widget

Go here WordPress Admin Area > Appearance > Widgets and add a WooCommerce Layered Nav widget to your sidebar and configure it to display the gender attribute like this:

Add gender widget

Provide default attribute value

When using the controlled vocabulary mentioned in the previous 2 examples you will see that if the gender field doesn't contain a gender in the controlled vocabulary you have configured, it will be ignored.

For example, if the product's gender is girl, it will be ignored because we have not configured any controlled vocabulary for that term.

In these cases, we need to configure our code to either use the provided term (ie. girl) or we can provide a default value. In this example, we will force the script to use the value provided in the "gender" or "extratexttwo" fields if they exist, otherwise not use any value.

1

Identify the fields

In this example, we will use 3 fields: gender, extratexttwo and name in that order.

2

Create a custom plugin

If you haven't done so already, create a custom plugin.

3

Add custom code

Add the following code to your custom plugin file.

Notice we are forcing the script to use the value provided by the merchant if there is no match in our controlled vocabulary. However we do not provide a default in line #16 as we do not want to store the product's name as a gender attribute.

4

Add/Update product sets

These changes will only take effect after any new Product Sets are created or after existing Product Sets are updated.

5

Expose filter as widget

Go here WordPress Admin Area > Appearance > Widgets and add a WooCommerce Layered Nav widget to your sidebar and configure it to display the gender attribute like this:

Add gender widget

Still need help? Contact Us Contact Us