List Display Type

Last Updated: December 30th, 2021

List Display Type:

  • On the display tab click default list to highlight it
  • Click edit display

General Settings

  • Spacing: Set the amount of space between the items
  • Paging: Split the list into pages
  • Items per page: Set the number of items to show per page
  • Page Transition: Set the type of transition to use between pages
  • Page Transition Ease: Set the easing of the transition between pages
  • Page Transition Speed: Set the speed of the transition between pages
  • Height Ease: Set the easing of the list height
  • Height Speed: Set the speed of the list height
  • Auto Play: Set the slider to auto play or not
  • Pause Auto play on Hover: Click the box if you want the item to pause when the mouse moves over it
  • Auto Play Speed: Set the amount of delay between slides
  • Shuffle Items: Click the box for the items to randomly shuffle on each page load

Arrow Navigation Settings

  • Arrows: Set the arrow navigation style
  • Arrows Icon Color: Add a custom icon color to the arrows
  • Arrows Background Color: Add a custom background color to the arrows
  • Arrows Position: Set the position of the arrows (center, top, bottom)
  • Arrows Padding: Add padding to the arrow’s container
  • Arrows Visibility: Check the box for the arrows to be visible at all times

Bullet Navigation Settings

  • Bullets: Set the bullet navigation style
  • Bullets Color: Add a custom color to the bullets
  • Bullets Active Color: Add a custom color to the active bullet
  • Bullets Position: Set the position of the bullets
  • Bullets Spacing: Set the amount of space between bullets
  • Bullets Padding: Add padding to the bullet’s container

Container Styles

  • Max Width: Set a maximum width for the container
  • Background color: Set the color for the background of the container
  • Padding: Set the padding for container
  • Margin: Set the margin of the container
  • Border color: Set the border color of the container
  • Border Style: Set the type of style for the border (dashed, line, etc.)
    • A border style must be selected for the border to appear
  • Border Width: Set the width of the border for the container
  • Border Radius: Border radius property defines the radius of the element’s corners
    • This where you can add rounded corners to your border

Content Styles

  • Background color: Set the color for the background of the content
  • Padding: Set the padding for content
  • Border color: Set the border color of the content
  • Border Style: Set the type of style for the border (dashed, line, etc.)
    • A border style must be selected for the border to appear
  • Border Width: Set the width of the border for the content
  • Border Radius: Border radius property defines the radius of the element’s corners
    • This where you can add rounded corners to your border

Page Styles

  • Background Color: Set the background color of the page
  • Padding: Add padding for the page
  • Border Color: Set the border color of the page
  • Border Style: Set the type of style for the border (dashed, line, etc.)
    • A border style must be selected for the border to appear
  • Border Width: Set the width of the border for the page
  • Border Radius: Border radius property defines the radius of the element’s corners
    • This where you can add rounded corners to your border

Item Styles

  • Text Color: Set the text color of the item
  • Background color: Set the color for the background of the item
  • Padding: Set the padding for the item
  • Border color: Set the border color of the item
  • Border Style: Set the type of style for the border (dashed, line, etc.)
    • A border style must be selected for the border to appear
  • Border Width: Set the width of the border for the item
  • Border Radius: Border radius property defines the radius of the element’s corners
    • This where you can add rounded corners to your border
  • Max Width: Set the maximum width for the items