The first thing customers do is monitor and filter the price, size, colours, categories and other item’s properties. So, in this tutorial, we will consider the main steps to set up the Attributes.
Each product you’re planning to sell should be listed as a WooCommerce product.
Firstly, navigate WooCommerce -> Products -> Add New product or edit already created one. After you created the product page, it’s time to set the attributes for this product.
Create the attributes
To create and set the attributes listed in WooCommerce, navigate to Products -> Attributes. Here you can add such properties as:
- Name. Add attribute’s name.
- Slug. A unique code for the attribute.
- Enable archive: check it if you want this attribute to have product archives in your store.
- The default sort order: defines sort order.
- After that just click Add attribute button.
When, on the right side, you will see your new attribute. Press Configure the terms to add info:
- Name: what will appear on the site
- Slug: a unique code
- Description: write more about the new attribute’s item
- Click “Add new” button.
Add the attributes to the product
To add the created attributes, to the product, open the product page and scroll down
- Find the Product data section
- Click Attributes
- Search your attribute and add it.
- After that, select the item’s relevant characteristics from the drop-down list. Here you can add new attributes as well. Notice, that you can add more than one choice.
Here you can see a short video instruction step by step:
Attribute Filter settings
Now you can use created attributes for filtering by Attributes in the Product Filter Plugin:
Here you can:
- Put Filter title and description.
- Select an attribute to be displayed on your site from the list.
- Show label as open/close/none.
- Show on front-end as checkbox list, drop-down, multiple drop-down or colours.
- For Colors, you have additional settings: icon type, layout – horizontal and vertical. Also, you can choose the number of Colors in a row, set an icons spacing, set an icon size and border. Check if you want to Show border and select the icon colour.
- Drop-down label. Use a drop-down first option text.
- Set attributes sorting by ascendance or descendants.
- Put maximum displayed height in the frontend.