Icon box Carousel Widget is a vary popular widget in the marker nowadays owing to its multiple usages for various purposes.

First tab like other widgets is the content tab for your data.


Here you have following fields.

Prefix Icon Text: As you can see in the second style there is a number in a small box. This number comes from this field and currently only works for style type 2.

Icon: you can select the icon your desire from elementor basic library. In addition we have imported couple of popular libraries.

Title: Icon box Title field is this one. Next to it is the content of icon box.

Layout Tab

All widgets that having some sort of sliding items following similar rules as above in a Carousel Settings box.

Offset in PX: Some styles need some space before or after your carousel. Set a number in px term for space before and your can enter negative numbers to space after.

Gap Between Boxes: you may modify the space between each slide with this option.

Number of items in view: set your desired number to be shown in the view.

  • Important: owing to responsive limits this part works as following
    • Desktop is set for 1025px resolutions and bigger
      • But if Tablet and desktop number have more than 1 difference, this number will be considered for bigger than 1600px and automatically consider one number lower for between 1025px up to 1600px.( E.g. read below ).
    • Tablet is up to max size of 1024px.
    • Phone is for up to 769px.
      • other exception is here that if your number is bigger than 1 then it will be considered for higher resolutions than 500px. and decrease the number by one for lower resolutions than 500px.

E.g :

  • Desktop(1920px) = 5
  • Tablet (1024px) = 3
  • Phone (769) =2
  • Low resolution Desktops ( 1366px,1440px, Up to 1600px ) = if ( desktop – tablet ) is bigger than 1 then => set 5 ( desktop ) – 1 = 4 for this purpose. Otherwise would not change basics.
  • Low resolution Phone ( lower than 500px ) = Phone – 1 = 1 for this ones

Show Arrows Navigations: Will activate arrow navigations of slider ( also activates related style in Styles tab).

Show Bullet Navigations: Will activate bullet navigations beneath the slider box ( also activates related style in Styles tab).

Loop: This makes your sliders loop able, meaning that if you reach the last slider it will not end and you can circles as much as you want in the slides.

Style Tab

As you can see there is no styles for carousel arrow and bullet navigation because we did not activated the options in layout tab.

Choose default style: is mainly for changing appearance of the widget in all widget. Here similarly you may choose other predesigned styles.