Text Input Component

This component is suitable for use when creating accessible courses.

The Text Input component is a question component that allows you to test your learners’ knowledge by letting the learner fill in blanks in sentences.

This article provides an overview of the Text Input component, component setup and behavior, and examples of Text Input component configurations.

Component overview

The Text Input component is an interactive question component that can be part of an assessment or used as a separate component in your course. The Text Input component lets you set up multiple questions where learners can type short responses. The Text Input component is excellent for missing words in a sentence.

The Text Input component is fully responsive.

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 a Display Title, as needed. Display Title is seen by learners.

Scroll down to add your Body. Use the text editor to style and format your text.

1. Add Instruction Text that tells users how to use the component.
2. Include an Aria Label for screen readers, as needed.

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 Text Input component. This widget can display an icon and label prior to the Text Input component completion, which changes to a different icon and label once the Text Input component is completed.

Behavior section

In the Behavior section, you enter how many Attempts the learner is allowed for the specific question. You can toggle to disable Display Attempts Counter and to disable Should be marked strictly, as needed.

Note: Enabling Should be marked strictly means that Evolve will only accept answers that are precisely like the Possible answers entered for each Text Input Item.

Enter some Placeholder text that the learner will see inside the Text Input box.

Appearance section

Select Display Item as Default in the Appearance section, or select Component Item to take all styles settings from the Evolve theme.

Set Item Prefix/Suffix Text Color, as needed.

Feedback section

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

1. Toggle to Display Feedback Inline. If enabled, Feedback will be displayed below the component instead of a dialog.
2. Toggle to disable Feedback Title. By default, Feedback Title is enabled, and Feedback will be displayed with the display title of the Text Input component.

Note: Enabling to display 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 in Course Builder > Edit Course Settings.
• custom text as feedback. Use the text editor to style and format your text, as needed.
• custom imagery as feedback, as needed.
• a link to a specific part of your course; if, for example, learners should revisit a particular section.

You can toggle to Enable Feedback Styles that override the theme styles' settings.

Add Text Input Items

In the Items section, you add Text Input Items to your Text Input component.

1. Enter Possible answers that will be accepted as correct.
2. Add Prefix. That is the text that will appear before the Text Input box.
3. Add Suffix. That is the text that will appear after the Text Input box.
4. Enter Input ARIA Label, to describe the Text Input to a screen reader, as needed.

Add, duplicate, or delete Text Input Items as needed.

Component Examples

Below are examples that illustrate the Text Input component:

Example 1 – Text Input component ready to fill in the blanks.

Example 2 – Text Input component with a correctly filled in answer.

Did this article help?

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