This plugin allows you to create custom product fields, including color or image swatches. This enhances the user experience and allows users to make selections based on visuals rather than plain text.

Here are some key features and capabilities typically offered by Gravity Forms Color or Image Option Swatches:

1. Visual Representation: This add-on replaces the default form field options with visual representations using color swatches or image thumbnails. Instead of plain text or dropdown menus, users can see and select options visually, which can enhance the user experience and make the form more engaging.
2. Color Swatches: If you’re using color options, this add-on provides the ability to display color swatches as the selection choices. Users can see the available colors and select their preferred option by clicking on the corresponding swatch.
3. Image Thumbnails: If you’re using image options, this add-on allows you to display image thumbnails instead of plain text or dropdown options. Users can see the images associated with each selection and make their choice by clicking on the desired thumbnail.
4. Customization Options: Gravity Forms Color or Image Option Swatches typically provides customization options to style and configure the appearance of the swatches or thumbnails. You can often adjust the size, shape, colors, and other visual aspects to match your form design or branding requirements.
5. Compatibility and Integration: This add-on is designed to work seamlessly with the Gravity Forms plugin, allowing you to integrate color or image option swatches into your existing forms. It is often compatible with other Gravity Forms features like conditional logic, calculations, and form notifications.

This article introduces you to how to use it.

Installation and settings plugin

1. Require Gravity Forms
2. Installation
3. New form and Settings

---

Require Gravity Forms – top

1. Download: http://www.gravityforms.com/

---

Installation – top

1. Upload the add-to-any directory to the /wp-content/plugins/ directory.

Please, ensure your plugin is installed and activated.

---

New form and Settings – top

Create a new form -> click the button “Pricing Fields->Option->Field Type-> Choose text, color, or image.

Implementing color option swatches

Format: “Label = color”: Eg: #666666 or Red

Step 2: Click on the button Edit choice and input color or color ID. Then update and have a look.

Implementing image option swatches

Format: “Label = URL image”: Eg: https://0.s3.envato.com/files/203096801/logo.png

Step 1: Choose Field Type is Image.

Step 2: Click on the button Edit choice and input URL of image. Then update and have a look.

Implementing text option swatches

Step 1: Choose Field Type is Text.

Step 2: Click on the button Edit choice and input text. Then update and have a look.

That’s it! We hope this article helped you learn how to use Color or Image Option Swatches with Gravity Forms.