The “List Widget” can be used to create styled ordered and unordered lists easily. The ordered list will add index numbers automatically to your list items. A lot of customization options are available to create exactly the look you want for your Elementor page. This widget comes with advanced options like Remote Connection and Syncing with other widgets.
Let’s look at each of the options in the “List Widget” below.
Install List Widget for Elementor #
This widget requires Unlimited Elements Free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “List”
- Hover over the widget in the search results and click install
- Add your “List” widget to any Elementor Page
General Settings #
Title Tag
Select the html tag for title.
- H1
- H2
- H3
- H4
- H5
- H6
- div
- span
- p
Enable Link
Enable/disable link option.
Gap
Set the gap between list items.
Number of Columns
Set the number of items to display in a row.
Icon Type
Select the icon type.
- Index
- Icon
Item Image Size
Select the item image size.
- Medium Large
- Large
- Medium
- Thumbnail
- Full Size
- 1536*1536
- 2048*2048
- WooCommerce Thumbnail
- WooCommerce Single
- WooCommerce Gallery Thumbnail
Transition Speed
Set the transition speed in milliseconds.
Sequence Entrance Animation Settings #
Sequence Entrance Animation
Select the sequence entrance animation for widget.
- None
- Appear
- Scale Up
- Scale Down
- From Left
- From Right
- From Top
- From Bottom
Connect Widget Settings #
Enable Remote Connection
Use remote control widgets to create advanced creative layouts.
Widget Name for Connection
This name will be used to connect and controls this widget by other widgets.
Sync
You can connect two item-based widgets and sync them.
Sync Group
Choose the same group for two or more item-based widgets so they can sync together.
List Source Settings #
Items Source
Select the item source for event list.
- Items
- Posts
- WooCommerce Products
- ACF Custom Field
- JSON or CSV
- Gallery
- Terms
- Users
- Menu
Items Settings #
Manage the list items using the repeater field.
- Add new items
- Duplicate items
- Delete items
- Reorder Items
- Edit Items
Title
Set the title for list item.
Text
Type text to display in list item.
Link
Paste or type URL to link.
Show Image
Show/Hide the image.
Override Default Colors
Select to override the default colors for normal, hover and active state.
List Widget Styling #
A variety of styling options are provided to control every aspect of the widget’s appearance. Select the colors that match the theme of your site. Make the widget look exactly how you want it to, by customizing the text, buttons, fonts, and layout.
Item Styling #
Style the layout, alignment, padding, background, border, and color of items.
Icon Styling #
In this section, style the icon size, spacing, typography, border, icon color, background, and radius.
Title Styling #
Set the title color, typography, and spacing.
Text Styling #
Set the text color, typography, and spacing in normal, hover and active state.
Image Styling #
Set the image width, height, positioning, alignment, radius, border, and margin.
Usage Examples #
Here are some live use cases for the List Widget.
List widget in vertical layout(Mobile Screen).
List Widget synced with Content Slider and Remote Tabs.
