All the different field types

Advanced Product Fields allows you to create powerful forms for your WooCommerce product pages. There are a large number of different field types that you can create. You can select the desired field type in the first setting when adding a new field:

the expanded Field Type drop-down menu

In this article, we list all the different field types in detail.

Text and Text Area fields

The Text field allows customers to enter information as a single line of text. This basic field can be used for anything where no more than a single line of input is required.

Alternatively, a Text Area allows the customer to enter text over multiple lines (mostly known as paragraphs).

Number field

The Number field allows customers to enter a number. In the settings, you can add restrictions to the field so customers can not enter a number above a certain maximum or below a certain minimum.

You can also define the type of the expected number: a whole number (integer) or a decimal number.

E-mail and URL field

The E-mail field is a single-line text field where your customer is expected to enter an email address. If the customer fails to enter an email address, a validation error will be shown.

Similarly, the URL field expects customers to enter an URL. A validation error will be shown for text that is not a URL.

Select list

A select list is also widely known as a dropdown menu. It allows customers to pick one choice out of a list of many choices. Just as with any other field, you can mark this field as required or not. When it is required, the user must make a choice before adding the product to their cart. If it is not marked as required, the field is optional and can be left blank.

Checkboxes

The checkboxes field allows the user to select multiple choices out of a list of checkboxes. You can define a minimum amount of choices required, or a maximum number of choices allowed for this field.

Radio buttons

Radio buttons allow a customer to select 1 choice out of a list of many choices. This field’s behavior is similar to a select list but the layout is rendered differently on the page (radio inputs instead of a dropdown list).

True/False

The True/False field renders one checkbox that your customer can check or leave unchecked. If you mark the field as required, the customer has to check it before the product can be added to the cart.

This field is particularly handy if you want to offer your customer a yes or no choice like “Yes, I would like to gift wrap this item”. Alternatively, this field type is also useful if you require customers to acknowledge something. A popular example is a checkbox to agree with your privacy policy or terms of purchase.

Image swatches

Image Swatches allow you to offer choices in a visually appealing way. They are clickable images. You can define if only one, or multiple choices should be selected. Here’s an example of image swatches on a website. The border shows which option is selected:

Example of image swatches on a WooCommerce product page

Text swatches

Similar to Image Swatches, Text Swatches allow you to offer choices through clickable buttons. You can define if only one, or multiple choices should be selected. Here’s an example of a text swatch with 3 options. The middle choice is selected:

Example of text swatches on a WooCommerce product page

Color swatches

Color Swatches allow your customer to select one or multiple colors out of a list of colors. You can freely choose how these swatches should look on your website: square, round, large, small, etc. Here’s a simple example of a color swatch with 2 choices. The orange choice is selected:

Example of color swatches on a WooCommerce product page

Date

Many products require customers to select a date. The Date field will render a calendar so customers can easily search and click on the date they need. In the settings, you can restrict the input so not all dates can be selected. In the Extended version, there are even more settings to fine tune the allowed selection. Here’s what the date field looks like on your site:

Example of a date field on a WooCommerce product page

You can read all the details of the date field here.

File upload

If you’re creating more complex WooCommerce products, chances are you need one or more files from your customer. That’s where the File Upload field comes into play. It allows you to ask customers for files on the product page.

In the settings, you can restrict file types and sizes to secure your file upload field. Here’s an example of a file upload with one file being uploaded:

You can read everything about the File Upload field here.

Images with quantity inputs

The Extended version of the APF plugin has one extra field type: Images with quantity inputs. It allows you to display images in a grid and quantity inputs below. You can add restrictions on how many items and quantities can be selected. Here’s an example:

Example of images with quantity inputs

Here is an example product where this field type is used.

Content fields

Aside from form input fields, Advanced Product Fields for WooCommerce also allows you to add content fields to your product pages. Those fields can display text, HTML, or images. For example, you can give more context to your users by adding extra text to clarify certain form fields.

Just like with all other field types, content fields can be shown or hidden conditionally. This makes it extra powerful as you can display extra information only if a customer selected a certain option.

Shortcodes

Do you need to add 3rd party content to your product pages such as booking calendars, iframes, or content from a different plugin? Advanced Product Fields for WooCommerce allows you to add shortcodes too. Any plugin that supports shortcodes can therefore be used inside your product page.

Was this article helpful?

Related Articles