About the Icon List element
The Icon List element allows you to display a list of content, each of them starting with an icon.
From the GemPages Dashboard, open your preferred template to edit. You can quickly find the Icon List element on the left sidebar of the editor page, under the “List” section.
There are two types of Icon List elements available in the GemPages Editor. The Icon List element is used to design a vertical list, while the Icon List Hoz element can help you show multiple icons horizontally.
When clicking on the element, you will find its configuration options in the left sidebar, including the Settings and Design tabs.
Configure the Settings Tab
Item list
In this first section, you can add or remove items. To add more, click on the Duplicate icon of a tab. To remove one, click on the Trash icon of the selected item, then confirm the action.
To change the Icon and text, click on it (which itself is an Icon or Text Block element) on the main Editor to open its configurations on the left sidebar.
Icon width
Use the slider or input the number into the box to adjust the distance between the icon and the text in pixels.
Spacing
Use the slider or input the number into the box to adjust the distance between the two items in pixels.
Alignment
This parameter allows you to determine how the element is positioned on your page. There are three options to choose from left-aligned, centered, and right-aligned.
Extra Class
If you wish to further customize the element with coding, please use this field to add a class name and refer to it in the CSS file.
Configure the Design tab
To style how the element looks, please navigate to the Design tab and follow the instructions in this article.
How to upload your icon
If you can’t find your desired icon in the GemPages icon library, please follow the instructions below to upload your own.
Step 1: From the GemPages Dashboard, open your preferred template to edit. Drag & drop the Icon List element to the position you wish.
Step 2: After that, you will need to remove the Icon from the Icon list and replace it with an Image element.
Right-click on the Icon and select Delete. Next, drop an Image element to the previous position of the icon.
Step 3: Click on the Image element to reveal its configuration on the left sidebar. Under the Image section, hover over the image and select “Replace Image” to upload the icon from your device.
