Skip to main content

Outline

This component is suitable for use when creating accessible courses.

The Open Input component lets your learners enter short sentences in response to a question within your Evolve course.

This article provides an overview of the Open Input component, component setup and behavior.

Component overview


The Open Input component is an interactive component. The Open Input component is handy for building sequences of short question and answer segments. The Open Input component can be configured to present feedback and an image to learners after submitting the answer.

The Open 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:

Screenshot of General settings

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

Screenshot of General settings

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

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


Input section

Screenshot of Input settings
  1. In the Input section enter some Placeholder text that the learner will see inside the input box.
  2. Enter Save button Text that will be shown on the save button.
  3. Enter Save success message that will show when user answer is saved.
  4. Enter Clear button Text.
Screenshot of Input settings

Enter a Text area Aria Label for screen readers, as needed. Enter Saved Aria Live Message and Cleared Aria Live Message.


Behavior section

Screenshot of Behavior settings

In the Behavior section, you toggle Should show feedback to the learner when saving the answer.

Toggle to Display Feedback Inline. If enabled, Feedback will be displayed below the component instead of a dialog.

Toggle to display Feedback Title. Feedback will be displayed with the display title of the Open Input component.

Note: Enabling to display Feedback Title will have no effect if Display Feedback Inline is enabled.

Enter Feedback to be shown to the learner once the answer has been submitted. Use the text editor to style and format your text, as needed.

Screenshot of Behavior settings
  1. Select a Feedback Image to display, as needed.
  2. Set Image Per Device Size as needed.
  3. Enter Feedback Image Alt Text.
  4. Select Feedback Image Position. By default, Feedback Image Position is set to Right.

Appearance section

Screenshot of Appearance settings

In the Appearance section, you toggle to Enable Minimum Height. The Minimum Height sets a minimum pixel height on the text area. By default, the Minimum Height is 300.

Did this article help?

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