Skip to main content
All CollectionsDynamic Content for ElementorFeatures
Dynamic Posts (old version) - Render - Swiper (Carousel)
Dynamic Posts (old version) - Render - Swiper (Carousel)
Updated over a week ago

"Swiper (Carousel)" is one of the render types of Dynamic Posts (old version) that shows a carousel of posts.

Settings

You can choose:

  • the speed of transition;

  • the transition effect between slides (slide | fade | cube | coverflow | flip);

  • the active slide will be centered;

  • how many slides per view with space between, number of slides for a column, slides per group;

  • freemode, so the slide will not have fixed positions;

  • navigation options:

  • arrows color;

  • use animation in rollover and hover colour;

  • stroke arrow and line;

  • dashed;

  • scale;

  • the horizontal and vertical position;

pagination options:

the type of pagination (bullets | fraction | progress);

the style of bullets or fraction or progress bar;

scrollbar options so you can use a scrollbar that displays navigation;

if you want to use autoplay;

if you want to enable keyboard or mouse control;

to enable continuous mode loop.

Special Options

In special options, you can choose:

  • set wrapper size enabling this option and plugin you will set width/height on swiper wrapper equal to the total size of all slides. It should be used mainly as compatibility fallback option for a browser that doesn't support flexbox layout well;

  • virtual translate enabling this option and swiper, it will be operated as usual except it will not move, real translate values on the wrapper will not be set. Useful when you may need to create a custom slide transition;

  • auto height, the slider wrapper will adapt its height to the height of the currently active slide;

  • round lengths, to round values of slides width and height to prevent blurry texts on usual resolution screens (if you have such);

  • nested, set to true on nesting Swiper for correct touch events interception. Use only on nested swipers that use the same direction as the parent one;

  • grab cursor, this option may a little improve desktop usability. If true, the user will see the "grab" cursor when hovering on swiper.

Example (Slider Background with arrows and bullets)

Example (Alternated Slider with arrows and bullets)

Did this answer your question?