Skip to main content
The slider widget uses the Swiper library to display scrolling effects for component cards. In the story editing interface, click “Slider Widget” in the toolbar’s insert area to create a slider widget on the current page. After selecting this component, edit its settings in the property editing panel on the right:

​
Slider Properties

The overall property settings of the slider widget correspond to the properties in the Swiper library. Property list:

​
Slides

The slides table configuration is a table for configuring the slider widget. Click the Add button below the table to add a new row, which is a new slider widget. Each card row configuration properties are as follows:
  • Component Type: The component type used by the card. Currently supported:
    • Analysis Card: Corresponds to the chart analysis component;
    • Indicator Card: Corresponds to the indicator card component;
  • Details: Perform corresponding detailed configuration for the selected component type. Refer to the corresponding component type configuration for details;
  • Actions: Delete the current configuration row;
Slide property list:

​
Autoplay

Autoplay property list:

​
Pagination

Pagination property list: Corresponds to Swiper Pagination Parameters property configuration.

​
Responsive Breakpoints

Responsive breakpoint properties allow setting different parameters for different responsive breakpoints (screen sizes). Not all parameters can be changed at breakpoints; only those that don’t require different layouts and logic, such as slidesPerView, slidesPerGroup, spaceBetween, grid.rows. Parameters such as loop and effect will not take effect. Responsive breakpoint property list: Corresponds to Initialize Swiper breakpoints property configuration.

​
示例