
This is where you add the content and style for individual list items. The General tab contains three sections: List items, Display, and List item tags. Settings for the entire list General tab See the settings below for more information about how to control the placement and style of the headings, content, and markers of items. Here's another example of a Generic-type list with heading, content, and icons, in which the icons are set to the right of the headings.Īnd here's an example with headings and content but no icons: You can adjust their position by using icon padding. When you select markers or icons to the right of the headings or content, they are right-aligned.

By default, the icon is vertically centered with the heading, but you can change the position by adjusting the icon padding setting. In this example, the icon size was increased. Here's an example of an ordered list with just headings and markers, no content. This is the typical numbered list with an tag in the HTML output, but you can choose from various ordering notations for the list item marker, such as numeric, alphabetic, or Roman, Hebrew, Armenian, or Greek numerals. Unordered lists are represented by the standard tag in the HTML output. Here's the same list with list markers displayed to the left of the content instead. Here's an example of an unordered list with both headings and content and list markers displayed to the left of headings.

The advantage of the List module is that you can style the markers by easily changing the size, adding padding to change their position, and placing them to the right or left of the list. You can choose from the standard circle and square icons that are available as list item markers for standard unordered lists. This is the typical bulleted list, but you can choose your list marker and adjust its size. If you choose to display list markers, they can be to the right or the left of either the headings or the content.

The List module is based on the Bootstrap concept of a List Group, with optional headings, content, and list marker icons. While it's easy to add bulleted and numbered lists in a text editor, the List module offers you an easy way to shape them into beautiful designs.
