How to Properly Add Nested Lists

If you have tried adding a sub-list (a nested list) inside of another list in the Haystack version of the accessible template, you may have run into some unexpected formatting issues, such as "breaking" the gray bubble, as shown below.

In this case, the instructor wanted to include the bulleted list under the second item in the numbered list (2. Explore...). Instead, formatting the bulleted list caused the page script to end the gray bubble. The bulleted list is not nested within the numbered list. The item that was originally third in the numbered list now appears to be the beginning of a separate list (1. Review...) at the bottom of the image. What happened here is the instructor added the text for the bulleted list, then formatted those lines as a bulleted list using the editing buttons at the top of the content editor. Here is a successful way to add a nested list:

1. Place your cursor at the end of the line below which your nested list will appear. In the image above, this would be at the end of line number 2, after the colon.
2. Click ENTER. This will create a new line that is numbered according to the original list. In the example above, it would create line number 3. The original line number 3 would automatically be re-numbered to line number 4.
3. Type in the text for the first line of your nested list.
4. Click ENTER.
5. Type in the text for the second line of your nested list.
6. Continue until all lines of the nest list has been added. You will be able to edit these lines later.
7. Use your mouse or touchpad to simultaneously highlight all lines of the list that will be nested. Do not select lines that will not be nested.
8. In the toolbar above, click the indent right button.
   • This will indent the highlighted lines to the right. Their numbering will change so that the first indented line is now starting a new list. The line numbering of the top level list will automatically adjust, as well.
   • You can now highlight the entire nested list and select a different list style from the toolbar above.
9. Submit your changes.

Your page should now include a numbered list with a nested list, all of which are contained in a single gray bubble, as shown below.

The properly nested list not only looks as intended, it also maintains the proper relation of ideas (the nested list is a sub-idea of the numbered list and the final item of the numbered list is connected to the rest of the numbered list). This helps students understand your lesson content and maintains accessibility and usability.

---