The Flexible Product Fields plugin extends WooCommerce product options with additional fields. It helps you to personalize your product page as you see fit. There are 20 different field types available and color picker is one of them. In this article I will tell you how to add it to your WooCommerce product page using the Flexible Product Fields plugin.
There are plenty of color picker WooCommerce plugins out there in the WordPress repository. What makes the Flexible Product Fields so special then, you might ask?
Well, let’s have a look:
- As many as 18 different field types available in the free version (among them the color picker field). And the amount of varied field types is still growing!
- Both the free and PRO version are constantly updated
- User-friendly design
- Simple installation and implementation
- Impeccable, professional technical support (1-on-1 if you decide for the PRO version)
- Competitive pricing
I encourage you to download it and try it out. Install the free version of this color picker plugin and see for yourself if it convinces you.
Flexible Product Fields for WooCommerce
Color Picker field overview
A color picker is a tool for choosing and customizing color properties. Users typically select colors using an engineered interface with a visible depiction of a color. A color picker normally consists of two main parts: a color slider and canvas.
What is the use of a color picker?
Let’s focus on the benefit this field might have on your WooCommerce product page.
- Firstly, it provides a quicker way to choose any existing color. Implementing a color picker input to your WooCommerce product page, you contribute to an improved user experience on your website.
- Secondly, it enriches it. Adding as much information as possible to your product page about your item, makes the user make up his mind more easily. You know what it means for you, right? You sell more --> you earn more 🤑
- Thirdly, you give the user the possibility to customize the product as per his preferences. By this means, the user has the opportunity to choose from any of the existing colors. Adding this feature to your product page, you definitely gain an advantage over the competition.
Add a color picker field to your WooCommerce product page
Let’s learn how to add this picker field to your page. First of all, you’ll need to download the Flexible Product Fields plugin.
Once you have it installed, a new tab will appear in the Products submenu. This is your WooCommerce color field plugin 🥳
Click it, Add a new Field Group and then select the Color field type, which is placed in the Picker Fields section:
Now let’s start the customization process as we see fit. Have a look at this example:
*We encourage you to familiarize yourself with our documentation where all field types are explained in detail.
These are the General settings. Additionally, you can also add a fixed or percent price or conditional logic. However, these two features are available only if you use the PRO version of the plugin. After you finish your color picker customization, don’t forget to save and publish your changes.
Eventually, this is how the final result will look like:
The Flexible Product Fields plugin has been recently updated and currently, in its latest free version, the following input fields are to be found:
- Radio with colors (New feature)
- Multi-checkbox (New feature)
- Radio with images