How to add a list
Step 1: In the page you wish to add a list, open the EE Builder.
Step 2: Click the '+' icon to add a new module.
Step 3: Select 'List' from the module list.
Step 4: Drag and drop the 'List' module into your desired page layout position.
The List module lets you transform plain bulleted and numbered lists into visually appealing designs, making it easy to enhance your content's look and feel.
General tab
The General tab is divided into three sections:
List Items
In this section, you can add and style individual list items. To get started, click 'Edit list item' to add your first item. Once saved, you can click 'Add list item' to include additional items.
Display
- List Type: Choose from Generic, Unordered, or Ordered lists.
- List Icon: Select an icon for the list item marker, with options varying based on the list type.
- List Icon Placement: Determine where the list item marker appears:
- Left of heading/content
- Right of heading (aligns with right margin)
- Right of content (aligns with right margin)
List Item Tags
List Item Heading Tag: Select the HTML tag for the list item's heading:
- <h1> - <h6>
- <span>
- <div>
List Item Content Tag: Choose the HTML tag for the list item's content:
- <div> (recommended if unsure)
- <aside>
- <section>
Style tab
List Background Colour: Applies a background colour to the entire list.
List Padding (Responsive): Adds space between the list border and list items, useful when using background colours or borders.
List Item Padding (Responsive): Adds padding around individual list items. For more granular control, use the List Item Padding setting on the Style tab to customise padding for each list item.
Border Around List (Responsive): Allows you to add a border, rounded corners (radius), or a shadow around the entire list.
To save and publish a module in the EE Builder
Click 'Save', then 'Done', then 'Publish'.