Slider Block
Create stunning image and content carousels with multiple effects, autoplay, and touch support.
What is the Slider Block?
A two-block carousel system:
- Slider Container – parent wrapper with controls
- Slide blocks – individual slides
Key Features
- Multiple effects (slide, fade, zoom)
- Autoplay with configurable speed
- Navigation arrows and dots
- Touch and swipe support
- Infinite loop option
- Customizable transition speed
- Pause on hover
How to Use
- Insert Slider block
- Add Slide blocks inside (3-5 recommended)
- Add content to each slide
- Configure effect and autoplay in sidebar
- Customize navigation appearance
Settings
Slider Container:
- Effect – Slide, Fade, Zoom
- Autoplay – Enable automatic sliding
- Autoplay Speed – Delay between slides (3000ms default)
- Transition Speed – Animation duration (600ms default)
- Show Arrows – Navigation arrows visibility
- Show Dots – Pagination dots visibility
- Infinite Loop – Continuous sliding
- Pause on Hover – Stop autoplay when hovering
Common Use Cases
Hero Slider
Full-width hero images with text overlays
Product Showcase
Highlight multiple products with images and descriptions
Testimonials
Rotating customer testimonials with photos
Portfolio
Showcase work samples in a carousel
Best Practices
- Use 3-7 slides maximum
- Keep slide content concise
- Use same aspect ratio images
- Set autoplay to 4-6 seconds
- Enable pause on hover for accessibility
- Test on mobile devices
Accessibility
- Keyboard navigation (arrow keys)
- Pause button for autoplay
- ARIA labels for controls
- Focus management