| 1 |
# Simple Card Slider - Widget Guide |
| 2 |
|
| 3 |
## Overview |
| 4 |
Simple Card Slider displays manual cards (image, title, description, button) in a responsive slider. Default styling adds spacing so arrows and pagination never overlap the cards. |
| 5 |
|
| 6 |
## Free Features |
| 7 |
- Manual cards via repeater (image, title, description, button with link). |
| 8 |
- Responsive slides per view, gap, loop, autoplay delay, and speed. |
| 9 |
- Show/hide arrows and dots with inside/outside placement, alignment, gap, and offsets. |
| 10 |
- Base styling controls for cards, text, buttons, arrows, and dots. |
| 11 |
|
| 12 |
## Pro Features |
| 13 |
- Per-card badges/ribbons with styling. |
| 14 |
- Advanced entrance/hover animations for cards. |
| 15 |
- Additional navigation and pagination style presets and placements. |
| 16 |
- Extended offsets, typography, and color controls for badges and chrome. |
| 17 |
|
| 18 |
## How to Use |
| 19 |
1. Add “Simple Card Slider” to the page. |
| 20 |
2. Populate cards in the Cards section (image, text, and button link). |
| 21 |
3. Adjust Slides Per View (desktop/tablet/mobile) and Space Between. |
| 22 |
4. Toggle Arrows/Pagination and set their placement (inside/outside) and alignment. |
| 23 |
5. Style card background, typography, buttons, arrows, and dots as needed. |
| 24 |
|
| 25 |
## Tips |
| 26 |
- Keep at least 16–20px gap when using inside navigation to avoid crowding the card edges. |
| 27 |
- Use outside pagination when slides have tall content to preserve vertical space. |
| 28 |
- Set consistent image sizes with the Image Size control for tidy layouts. |
| 29 |
|
| 30 |
|
| 31 |
|
| 32 |
|
| 33 |
|
| 34 |
|
| 35 |
|
| 36 |
|
| 37 |
|
