Amazing Custom Carousel Pro, a free module with unique options for any website type
Documentation (J5 / J6)
This version is brand new so you need to set module again
Custom Carousel Pro is a Joomla 5 site module that renders a Bootstrap 5 carousel using Joomla’s built-in Bootstrap assets. Slides are managed through a repeatable (subform) field in the module options, allowing you to build a carousel with titles, rich content (editor), and background styling per slide.
Installation
- Go to System → Install → Extensions.
- Upload the provided module ZIP.
- After installation, go to Content → Site Modules and create/configure Custom Carousel Pro.
If your system requires the manifest at ZIP root, use the package labeled _root.zip.
Module Settings
Tab: Basic
These options control behavior and global presentation.
Autoplay
- Autoplay: Enable/Disable automatic slide cycling.
- When disabled, slides change only via arrows/indicators.
Speed interval (ms)
- Speed interval (ms): Time between slide transitions in milliseconds.
- Example: 1000 (1 second)
- Applies when Autoplay = Enabled
Visible items per slide
- Visible items per slide: Number of slide items shown at the same time within one carousel frame 1,2,3,4.
-
Visible items per slide (Desktop)
-
Visible items per slide (Tablet)
-
Visible items per slide (Mobile)
-
Carousel width: px or %
Carousel height: px or %
Item border
- Item border: Adds a border to each visible item box using a CSS border value.
- Example: 1px solid #000000
Carousel titles
- Carousel titles: Show/Hide slide titles globally.
- Titles text color: Sets the color for all slide titles.
- Titles alignment: Align titles Left / Center / Right (applies to titles only).
Content alignment (center, spacing, etc.) should be handled in the editor content using Bootstrap classes or the editor’s formatting, since the content container is intentionally minimal.
Navigation arrows
- Navigation arrows: Enable/Disable previous/next controls.
- Arrows color: Sets arrow icon color.
- Arrows hover color: Sets arrow icon color on hover.
- Arrows size: px, rem etc
Carousel controls (pagination/indicators)
- Carousel controls (pagination): Enable/Disable indicators (the small navigation dots/buttons).
- Current control color: Color for the active indicator.
- Other controls color: Color for inactive indicators.
Tab: Slides
This tab contains the repeatable slide manager (subform field).
Carousel Items (Repeatable)
Each slide entry includes:
- Title
- Slide title text (controlled globally by “Carousel titles” settings in Basic).
- Carousel Content (Editor)
- WYSIWYG editor field for rich slide content (text, headings, lists, buttons, etc.).
- Recommended: use Bootstrap utility classes inside the editor content as needed.
- Background (Image or Color)
- Configure a background image or a background color per slide.
- Background options
- Background Size (e.g., cover, contain)
- Background Attachment (e.g., scroll, fixed)
- Background Position (e.g., center center)
- Background Repeat (e.g., no-repeat, repeat)
These values are applied inline per item to produce the correct background behavior.
Tab: Advanced
- Layout: Select module layout override.
- Module Class Suffix: Adds a suffix to the module’s wrapper class (useful for styling via template CSS).
* Important: You need to set module from the beggining. This version is different from previous versions (J3 /J4)
Video settings
DOCUMENTATION J3 / J4
Our modules are distributed under the GNU General Public License version 2 or later.
