Using the Ranking Field

Would you like to ask your users to put a list of options in order? With the Ranking field for WPForms, users can arrange choices from most to least preferred, giving you clear preference data for product decisions, event planning, and more.

This tutorial will show you how to add and set up a Ranking field in WPForms.

---

Before you get started, be sure to install and activate WPForms on your WordPress site. After verifying your license, you’ll be able to quickly install and activate the Surveys and Polls addon.

Adding a Ranking Field to Your Form

Once the Surveys and Polls Addon is installed and activated, create a new form or edit an existing one to open the form builder.

In the form builder, you’ll find the Ranking field in the Fancy Fields section. Click it or drag it into the preview area to add it to your form.

The field includes 3 placeholder choices and a short description that explains what to do: “Put these options in order, with your most preferred at the top.” This description appears by default because ranking is a different kind of interaction than most fields, and users may need a quick hint.

Unlike other choice-based fields, the Ranking field does not include a Required option. Users rank options by arranging them, so every submission includes a complete order. If someone submits the form without moving anything, the order shown on their screen is saved as their response.

Customizing Ranking Field Options

After adding the field, click on it in the preview area to open its Field Options panel. Here you can customize the choices users will rank and the way the field looks on your form.

Choosing a Layout for Your Choices

The Ranking field offers 2 layouts. You’ll find the Layout option in the field’s Advanced tab. Which one you pick changes how choices are arranged, and how users read the ranking order.

Using the List Layout

List is the default layout. It displays each choice as a full-width row, stacked from top to bottom. The option at the top is ranked first.

This layout suits longer choice labels, since each row has the full width of the field to work with. It’s also the better choice when your options are text only.

Using the Grid Layout

The grid layout displays each choice as a card. Cards are ranked from left to right, then top to bottom, so the card in the upper left is ranked first.

To switch, open the Advanced tab and set Layout to Grid.

When you select the grid layout, the field size changes to Large automatically to make the best use of the space. The default field description also updates to tell users to put their most preferred option first, since the order now reads left to right.

Setting the Number of Columns

Once the grid layout is selected, a Columns option appears below it. Use it to set how many cards sit in each row. You can choose between 2 and 6 columns, and the default is 3.

Pick a column count that fits the number of choices you have. Fewer columns give each card more width, which helps when your labels are long. More columns keep a longer list of choices visible without scrolling.

General Options

In the General tab, you can edit the field’s label and description, as well as the choices users will put in order.

Under Choices, add, remove, or reorder the options for your question. The order you set here is the starting order users will see on your form.

To add a long list of options in one go, see our guide to bulk adding choices. You can also generate choices with AI.

To display your choices as pictures or icons instead of plain text, toggle on Use Image Choices or Use Icon Choices. For setup details, check out our tutorials on adding image choices and using icon choices.

Customizing Advanced Ranking Field Options

In the Advanced tab, you’ll find more ways to control how the field works and looks.

• Enable Survey Reporting: Collect ranking statistics for this field. This option is on by default, so your results are ready as soon as entries come in.
• Randomize Choices: Shuffle the starting order for each visitor. This helps reduce bias from users who submit the form without reordering the options.
• Field Size: Set the width of the field to Small, Medium, or Large. When you select the grid layout, the field size changes to Large automatically to make the best use of the space.
• Layout: Display choices in a List or a Grid. See the layout section above for details on both layouts.
• Arrows: Control when the reorder arrow buttons are visible. Choose On Hover (the default), Visible, or Never. Arrows are always displayed on touch devices, no matter which setting you pick.
• Dynamic Choices: Fill the choices automatically from your site’s posts or taxonomies. This option isn’t available while image choices are enabled.
• CSS Classes: Add custom classes to the field for styling purposes.
• Hide Label: Hide the field’s label on your form.
• Hide Choice Label: Hide the text under each choice and show only the images. This option appears when image choices are enabled.
• Read-Only: Prevent users from changing the order of the options.

How Users Rank Options

On your published form, users have 2 ways to arrange the options. They can click anywhere on an option and drag it to a new position. Or, they can hover over an option and use the arrow buttons to move it one position at a time.

In the list layout, the arrows move options up and down. In the grid layout, they point sideways instead, and move options left and right. When an option is already in the first or last position, the arrow that can’t be used is disabled.

Viewing Survey Results

Since survey reporting is enabled by default for the Ranking field, your results start collecting as soon as entries come in. To view them, go to WPForms » Entries and select your form. You’ll see a results card for your Ranking field above the list of entries.

Ranking results use 2 metrics you won’t see for other survey fields:

• Times at #1: How many users placed the option in the first position.
• Rank: The option’s average position across all responses. A lower number is better, so a rank of 1.2 means the option usually landed near the top.

The graph plots the average rank for each option, with the options listed in the order they appear in your form. The answers table next to the graph is sorted by rank, so your users’ favorite option sits at the top. You can click the column headers to sort the table differently.

To see the full report, click View Survey Results. From there, you can change the graph style, filter results, and export or print your report. If you switch the graph to a bar or pie chart, it shows how often each option was ranked first instead of the average rank.

Enabling Conditional Logic for Rankings

Conditional logic lets you show or hide the Ranking field based on how users answer other fields in your form. To use it, open the field’s options, click the Smart Logic tab, and toggle on Enable Conditional Logic. Then set up the rule for when the field should appear.

Frequently Asked Questions

Below, we’ve answered some of the most common questions about the Ranking field.

How is the Ranking field different from other survey fields?

Most survey fields measure one thing at a time. The Rating field scores a single item on a scale, the Likert Scale rates agreement with a set of statements, and the Net Promoter Score asks how likely users are to recommend you. The Ranking field is the only one that asks users to compare options and put every option in order. Use it when you want to know what users prefer, not just how satisfied they are.

Can I make the Ranking field required?

The Ranking field doesn’t include a Required option because every submission always contains a complete ranking. If a user doesn’t move any options, the order displayed on their screen is saved as their answer.

Why don’t my users see the reorder arrows?

By default, the arrows only appear when a user hovers over an option. If you’d like them shown at all times, set the Arrows option to Visible in the field’s Advanced tab. On touch devices, the arrows are always displayed no matter which setting you choose.

Can I use the Ranking field in Conversational Forms?

Yes. The Ranking field works in Conversational Forms. One difference to keep in mind: if you set the Arrows option to Never, your conversational form will still show the arrows on hover so users can reorder the options.

Can other fields use conditional logic based on the ranking?

No. You can show or hide the Ranking field itself using conditional logic, but other fields can’t use the ranking as a condition. For example, it isn’t possible to show a field only when a certain option is ranked first.

What happens if I change the choices after collecting entries?

Existing entries keep the order users submitted. If you remove a choice, it appears with a “(modified)” label in your reports and exports. If you edit the form’s choices while a user has the page open, they’ll be asked to reload the page before their submission goes through.

How does the Ranking field appear when I export entries?

In CSV and XLSX exports, each choice gets its own column, and the cell shows the rank number the user gave that choice. This makes it easy to sort and analyze rankings in a spreadsheet.

That’s it! You can now add a Ranking field to your forms and see exactly which options your users prefer.

Next, would you like to learn more about analyzing the responses you collect? Be sure to check out our tutorial on the Surveys and Polls Addon for details on filtering results, customizing graphs, and exporting reports.