✓ In this article, we'll look at how to create and optimize a list in your creations.
Adding a List to your Creation
First, add a text element to your design, then select List formatting.
Step 1: Add the Text Item
In the left-hand panel of your Kehio editor, select or add a Content.
Once selected, a panel will automatically open, allowing you to add a “Text” item.
Step 2: Choose the formatting
In the editor toolbar, select the formatting icon, then scroll to the List option and select it. Your list is now created.
Optimize the Text Content of Your List
With Kehio Editor, you can customize and optimize the text content of your list for all screen resolutions. To do this, go to the Settings section and select the LI (List ) panel.
1- Font color
Adjust the font color to highlight the contents of your lists.
2- Font style
Choose your font style from : Light, Normal, Medium, Semi-bold, Bold or Extra-bold.
3- Size and alignment on all screen resolutions
Adjust the size and alignment of your list on all screen resolutions for a better user experience.
4- Line height
Increase or reduce the space between the lines in your list to adjust the layout.
5- Position
Define the alignment of your list:
Left-aligned: the text and icon of your list remain aligned one below the other.
Line feed: the text is positioned below the list icon or bullet when the list is made up of several lines.
6- Add a Custom Icon to the entire List
Customize your list by adding a common icon to all items to reinforce your brand identity. You can then adjust the margin and alignment between the icon and the text for optimal rendering.
Managing Your List's Block Margins
With Kehio Editor, you can adjust the margins of your list's parent block to match your overall design.
To do this, access the parent block parameters (UL) in the Settings> UL (Parent) section, then adjust the margins.
UL block definition ( Parent )
The UL (Unordered List) tag is the parent block containing an unordered list in HTML. It groups together all the elements of the list, represented by LI (List ) tags.
In the context of Kehio Editor, the UL parent block is used to manage the global properties of a list, such as margins.
Example of HTML structure of a UL parent block :
<ul>
<li>First item in the list</li>
<li>second item in the list</li>
<li>Third item in the list</li>
</ul>
Each LI inside the UL corresponds to an item in the list.
If you need help fine-tuning your list with Kehio Editor, don't hesitate to contact us. Our team is available to assist you by email or chat.