Skip to main content


This component is NOT recommended for use when creating accessible courses.

The Ordering component lets you build in items and test the learner’s ability to arrange the items in a predefined order.

This article provides an overview of the Ordering component, component setup and behavior, and examples of the Ordering component.

Component overview

The Ordering component is an interactive question component that lets you present items and tests the learner’s ability to arrange the items in a predefined order. Learners can test their knowledge and receive feedback.

The Ordering component is fully responsive and can be part of an assessment or used as a separate component in your course.

Component set up

To add this component, follow the steps in this article:

The Property Panel for the newly added component will then open automatically for you to customize set-up.

Or click anywhere on an existing component to open the Property Panel.

General section

In the General section:

Add Title, or an Display Title, as needed. Display Title is seen by learners.

Scroll down and add your Question. Use the text editor to style and format your text, as needed.

  1. Add Instruction Text that tells users how to use the component.
  2. Include an Aria Label for screen readers, as needed.
  3. Fill in Cancel Button Aria Label to describe the button as needed. This button is used to cancel the current ordering component item selection.

Interaction Label section

In the Interaction Label section, you can enable an Interaction Label.

The Interaction Label allows you to add a widget before or after the Ordering component. This widget can display an icon and label prior to the Ordering component completion, which changes to a different icon and label once the Ordering component is completed.

Add Answers

In the Answers section, you Add Answers to your Ordering component.

Add Answer Text. This is the text that will be shown on the answer label.

Note: The correct order for your Answer Items is the answer items' order set up in the Answers section.

Add, duplicate, or delete Answer items as needed.

Component Examples

The Ordering component gives you flexibility and can be added to your Evolve course as a left-handed, full-width, or right-handed component. Below are examples that illustrate examples of the Ordering component:

Example 1 – Example of the Ordering component before the learner has submitted an answer. This example is configured to display Attempts and Show Feedback.

Example 2 – Example of the Ordering component after the learner has submitted an answer and Feedback is displayed in a Dialog pop-up.

Example 3 – Example of the Ordering component after the learner has submitted an answer and Feedback is displayed Inline the component. With this setting the Feedback is displayed below the component.

Example 4 – This example shows that to change the order for an Answer item in the Ordering component, to do this: Click on the item you want to re-order and then click on the correct order number for that specific item. In this example the item should be changed and placed as number one.

Behavior section

In the Behavior section, update the number of Attempts the learner is allowed, as needed. The default setting is 1 attempt.

By default, Display Attempts Counter is enabled. Toggle to disable Display Attempts Counter.

Feedback section

The Feedback section lets you tailor feedback for correct, partly correct, or incorrect Ordering. Feedback can be displayed on the page, beneath the component or in a notification pop-up.

Toggle Display Feedback Inline. Feedback will be displayed below the component if this is enabled instead of in a Dialog.

Enabling Feedback Title will display the Ordering Display Title inside the Feedback Dialog pop-up.

Note: The setting Feedback Title will have no effect if Display Feedback Inline is enabled.

For each type of feedback, you can choose to include:

  • global feedback set up
  • custom text as feedback. You can use the text editor to style and format your text as needed
  • custom imagery as feedback
  • a link to a specific part of your course; if, for example, learners should revisit a particular section
  • a feedback style that overrides the theme styles settings

Did this article help?

Let us know by leaving a star rating or review at the top of this article.