How To Setup Filter Swatches?
Written by the Divi Engine Documentation Team
Follow these steps to set up filter swatches.
What Are Filter Swatches?
A Filter Swatch is an attractive WooCommerce Filter that uses colour or images instead of words. Our Filter Swatches are used in the Filter Posts Module.
Step 1: Create Product Attributes
Go to Product > Attributes and add your attribute. For example, Origin Country is one of the Product Attributes below.
Step 2: Edit Each Attribute
When editing each Product Attribute you will need to choose a Type. Make sure that you select the correct type depending on the type of data that you would like to use. For example, Colour will be Type Color and Image will be Type Image.
Step 3: Configure Items
Next up you will need to configure Items for each Attribute. The configuration will depend on the type of data that you have assigned to this attribute. For example, if you have selected Color then add your different Colours as Items.
Step 4: Add Filter Item
Make your way to the page where you have added the Filter Posts and Archive Loop Module and add a New Filter Item searching for the correct Product Attributes. Then enable the Show Attributes Swatches button and select Filter Type as Checkbox / Radio Buttons.
Step 5: View Swatches
View your new Filter Swatch from the frontend.
Please email us at [email protected] if you are unable to get Divi Ajax Filter working.