Icon lists are a great way to present information in a clean, visually engaging way — instead of bullet points or numbers, you use small icons beside each line. In this lesson, you’ll learn how to edit, add, and style your icon list elements in Elementor.
🎯 What You’ll Learn
-
What an icon list is
-
How to edit text and icons in the list
-
How to reorder, duplicate, or delete items
-
How to add a new icon list to a page
-
How to style the icons (e.g. color)
💡 What Is an Icon List?
An icon list is a visual list of items where each line has:
-
An icon (like a checkmark, phone, email symbol)
-
A short line of text or information
They look modern and help highlight key points or contact details quickly.
🛠 Step-by-Step: Editing an Existing Icon List
✅ Step 1: Open the Page in Elementor
-
Go to the page you want to edit
-
Click on the pencil icon next to the icon list section
You’ll now see all the icon list items appear in the left-hand Elementor sidebar.
✅ Step 2: Edit the Content
Each item in the list is editable:
-
✏️ Click on the text to change the words
-
🌟 Click on the icon to change to a different one
You can also:
-
Reorder items by dragging them up or down
-
Duplicate an item to save time
-
Delete an item using the X icon
💡 Pro Tip: Duplicating saves time — no need to reselect the icon each time.
➕ Adding a New Icon List to the Page
Want to insert a brand new icon list somewhere else on the page?
-
Click on the + plus icon to add a new element
-
In the Elementor sidebar, search for “Icon List”
-
Drag and drop the Icon List widget where you want it on the page
-
Start editing the text and icons just like before
🎨 Styling Your Icon List
To make the icon list match your website’s look:
-
Click on the icon list widget
-
Go to the Style tab
-
Under Icon, choose:
-
Icon color
-
Icon size
-
Space between icon and text
-
🎨 You can also use your global colors for consistency across the website.
🗑 How to Delete an Icon List
If you no longer need the icon list:
-
Right-click on the widget
-
Select Delete
-
It will be removed from your page
✅ Final Step: Save Your Work
Once you’re happy:
-
Click Update to make it live
-
Or Save Draft if you’re still working on it
🎉 That’s It!
You’ve now mastered how to:
-
Edit icon lists
-
Add new ones
-
Style them to fit your brand
This is a great way to keep your site clean, structured, and user-friendly.
