Image Carousel Block in Page Builder

You can now add an image carousel block to your whitelabel pages using the page builder.

---

Features

• Multiple slides — Add as many slides as you need, each with a desktop image and an optional mobile-specific image
• Drag to navigate — Visitors can swipe or drag to switch between slides, just like the homepage banner carousel (powered by Swiper)
• Navigation controls — Optional arrow buttons and dot indicators for easy navigation
• Autoplay — Configurable automatic slide rotation with adjustable interval (2–15 seconds)
• Loop mode — Seamless infinite looping through slides
• Custom dimensions — Set width (%) and height (px) to control the carousel size
• Links — Each slide can link to a URL, opening in the same or a new window
• Alt text — Accessibility-friendly alt text per slide
• Responsive images — Serve different images for desktop and mobile using the <picture> element

How it works

• Open the page builder and click Add Block
• Select Image Carousel from the block list
• Use the filmstrip at the top to add, select, reorder, and delete slides
• Upload images for each slide in the editing panel below
• Click the gear icon to open Carousel Settings and configure autoplay, arrows, dots, loop, draggable, and dimensions
• The carousel renders with a fixed height and object-fit: cover to ensure consistent layout across slides

Carousel Settings

Setting	Default	Description
Autoplay	On	Automatically rotates slides
Interval	5s	Time between slide transitions
Navigation Arrows	On	Show prev/next arrow buttons
Dot Indicators	On	Show clickable dot navigation
Loop	On	Infinite loop through slides
Draggable	On	Allow swipe/drag to change slides
Width	100%	Carousel width as a percentage
Height	400px	Carousel height in pixels