booster addons
creative elementor bundle
Purchase Now
Purchase Now
Purchase Now

Home - Widgets - List Info Box

List Info Box

Preview Widget
Preview Widget
Getting Started
Content
Global Layout
Content & Icon Styling

More Widgets

• Interactive Icon Box
• Icon Box Action
• Price Listing
• Side Navigation

# Getting started

The list info box allows you to display your content text in a list layout.Each item in the list can have an icon, heading and sub heading, and a short text.You can style everything from the text to the icon with the possible use of a custom style for each item.

Here are the options available in this widget.

List Content

The content section is where you will manage your list content.You can add an item to the list by clicking on the add item button at the bottom of this section.

  • Icon : Select one of the icons provided in our extensive icon libraries.
  • Heading :  A title text that gives a global insight about the information or service you are showcasing.
  • Sub-heading : An optional small more detailed text about your element.
  • Short text : A description text that gives more information about what you want to showcase.
  • Link : Specify a go to link on click.You can click on the link options button(The cog wheel on the right) to enable the 'open in new window' and the 'no follow' options.
  • Custom Styling : Enable this option if you want to create a specific style for this item.The options below will become available.
  • Text Colors : Change the color for the heading, sub heading, and short text.
  • Normal & Hover : Select​ which item state you want to customize.Normal for the idle state and hover for when this specific item is being hovered.Note that all the remaining options of this section will only affect the selected state.
  • Icon Hover Effect : This option will only available when the hover state styling is selected.You can select one of the many hovering animations available in the list.
  • Icon Colors : Customize the color for both the icon and icon background.
  • Radius, Border & Box Shadow : Customize the icon background radius to change its shape and add a border and a box shadow to add even more design to this element.

Layout

Under the layout section, you can change the layout alignement.

  • Layout Alignement : Change the widget list alignement.The options available are left and right.

Styling

Under the styling tab section, you will have the full control over the styling & design of all you interactive icon box widget elements, you can change the sizes, colors, backgrounds...

  • Text Content Styling

Customize the text properties and colors for the heading, sub heading and short description text.Change the font family, font size, line-height, letter spacing...

-Colors : Customize the color of your text elements for the heading, sub heading, and short text.You can also change the heading on hover color

  • List Styling 

Alternate the style for the list connector.

-Connector Type : Select the connector type for the options available or select none to disable it.

-Connector Color : Customize the color for the connector.

-Connector Width : Change the size of the connector by controlling its width

  • Icon Styling

Control everything about your icon and customize the color schemes.

-Icon and background size : Control the icon size and the background size to create a unique design.

-Normal & Hover : Select​ which widget state you want to customize.Normal for the idle state of the widget and hover for when the widget is being hovered.Note that all the remaining options of this section will only affect the selected state.

-Icon Hover Effect : This option will only available when the hover state styling is selected.You can select one of the many hovering animations available in the list.

-Colors : Customize the color for both the icon and the icon background.

-Radius, Border & Box Shadow : Customize the icon background radius to change its shape and add a border and a box shadow to add even more design to this element.

  • Distances

Control the margins & distances between each of the widget elements to create your own layout.

Get Help From Professionals

Can't find what you are looking for?

If you can't find what you are looking for any our documentation website, please feel free to open a support ticket  & get help from our support team.

Open a Ticket
Open a Ticket

WHO ARE WE ?

We are a group of talented WordPress developers & designers from Morocco our main goal is to create great products & provide the best services to our customers.

BOOSTER ADDONS

CREATIVE ELEMENTOR BUNDLE

HELPFUL LINKS

About Us

Documentation

Blog Articles

Video Tutorials

Request Support

GET INVOLVED

Feedback

Bug Report

Submit Design

Privacy Policy

Terms & Condition

FOLLOW US

Email : contact@certaindev.com

WebSite : Certain Dev

Made with love from Earth!

Certain Dev | all rights reserved © 2020