Techfyd

Welcome to Techfyd! If you have any inquiries or innovative ideas, feel free to let us know.

How to Use List Group Widget in Elementor

Now List Group is a creative and necessary design for a website. Readers always appreciate the material that is clear and straightforward which helps them in easily analyze information.

You can easily build fully designed lists for your website with the List Group Widget. With the help of this widget, you can edit the presentation of your list and add icons, images, text, and links.

The List Group widget allows you to create a beautiful hierarchical list of items. Each item in the List group is a separate paragraph element.

If you are looking for a List group widget then the widget of Sky Addons would be best for you. In this article, you will find out how to use the Sky Addons List Group widget.

Step 1

Firstly go to your Elementor Editor and find the List Group widget from the Editor Panel. Then simply drag and drop it into the section area.

List Group Widget in Elementor

In the Content Tab, you can configure the list group contents.

Here you can add List Items as many as you want. You can change list item names from here and put names according to your choice. 

If you want to add a new list item then just click on the ‘Add Item’ button and if you want to delete any of them click on the cross button on the right.

You can set the Direction Icon from here to make the List Group more attractive. If you don’t want to add direction then you will also get an option to turn it off. 

You get the similar option for showing text as well, if you want you can turn it off. You can also change the list item’s alignment from here and set the Title HTML tag.

List Group Widget in Elementor


In the List Group section, you can choose media type, title, text, and URL for each list item separately. You can set ‘media type’ in number, image, or icon, whatever media type you want to use, you can do it from here.

You will get an option for enabling customization. If you want to do customization then you can enable it. From here you will be able to change the background as you wish, you can use color or image.

List Group Widget in Elementor

As you can see in the image below, you will get 3 options in the media type. You can set the number/icon/image for the list group according to your choice.

List Group Widget in Elementor

Step 2

Now we move to the ‘Style’ Tab. Under the style tab, you will find List, Media, Title, and Direction sections.

List Group Widget in Elementor


In the List section, you can give space between the list items, you can change the height, add padding, select border type, border radius, box shadow, and add a hover effect according to your choice.

List Group Widget in Elementor


The ‘Media’ section allows you to change the size of the media, and adjust spacing and padding. You can select border type, add border-radius, and many more.


In the Title section, you will get options for Bottom spacing. To make it more attractive you can set the color, typography, and text-shadow, and also you can add a hover effect to the Title.


Lastly in the Direction section, you can set the size of your direction icon, can give spacing, and add padding if you want.

You can change the border type and change its radius like in the image below. You will find options for adding color, background type, and image. You can also add a hover effect to the direction icon.


Now finally click on the update button and the Sky Addons List Group widget is ready to impress the visitors.

We hope that you have understood everything about using the Sky Addons List Group widget in Elementor.
Here is the Demo Link of the widget – https://demo.skyaddons.com/elementor-list-group-widget/

Give it a try and if you got any questions feel free to contact our website – https://techfyd.com/support/

Scroll to Top