How to Add Color Swatches Filter in WordPress (Step-by-Step Guide)

Install Unlimited Elements Blocks Library

• Go to the Unlimited Elements plugin page on WordPress.org.

• Click Download, then in your WordPress dashboard, go to Plugins → Add New → Upload Plugin and upload the ZIP file.

• Click Install Now and then Activate to enable the plugin.

Open the Blocks Library

• From your WordPress dashboard, go to Unlimited Elements → Blocks Library.

• This is where all available blocks are listed and managed.

Search for the Color Swatches Filter Block

• Use the search bar at the top right and type “Color Swatches Filter”.

• The Color Swatches Filter block will appear in the results list.

Install the Color Swatches Filter Block

• Hover over the Color Swatches Filter block and click Install.

• This adds the block to your available options in the editor.

Add Color Swatches Filter to a WordPress Page

• Open any page or post using the WordPress block editor.

• Click the (+) Add Block button, search for “Color Swatches Filter”, and insert it into the page.

Customize the Color Swatches Filter Block

Once added, select the Color Swatches Filter block and use the settings panel on the right. Adjust the Target Widget Name to connect the filter to your post content, choose the Taxonomy Source for colors and the Swatch Shape, and control the visibility of the Term Label. Customize the Styling for the Swatch Size, Border, and Active Indicator to create a functional, visually appealing content filtering system that fits your site’s design.