A new page type that provides a carousel with easily reorderable items and custom HTML captions
It implements a new page type (CarouselPage) that provides everything
needed to manage a carousel of images. Differently from other carousels,
this one does not have the concept of seats (or slots), so managing the
images is much easier on the backend side.
You can do bulk uploads and reorder the images by dragging and dropping
their thumbnails in a dedicated tab (Image list) inside the CMS. The
same image can be shared among multiple carousels. This module adds also
some field to the Settings tab, allowing the customization of some
aspect of the carousel on a per page basis (e.g., width and height of
the images and a flag to show or hide captions). Support for the
module is provided out of the box, i.e. when creating a translation,
the new page will borrow the original carousel images.
To improve file organization, if you upload your images from the
carousel a specific folder is pre-selected (it it exists!) instead of
the fallback one (
Uploads). The folder name depends on the class
hierarchy. If, for example, you inherit your
HomePage type from
CarouselPage, the code will look for any
(in this order) under your assets directory.
The feature of reordering with drag and drop is provided by the
sortablefile module that
must be installed before.
To install silverstripe-carousel itself you should proceed as usual:
drop the directory tree in your SilverStripe root and do a
/dev/build/. You will gain the new
CarouselPage type in the CMS.
If you use composer, the dependencies will
be pulled-in automatically, so you could just run the following command:
composer require entidi/silverstripe-carousel
library you prefer by writing a proper template.
You can include one of them in any place inside your page template, e.g.
a basic Bootstrap layout template could look like this one:
The default layout (
CarouselPage.ss) embeds a bxSlider carousel.
Alternatively, the silverstrap
theme already supports this module out of the box. If you intend to
leverage Bootstrap, consider using this theme instead, either by
overriding or by modifying it.
HTML captions are allowed. This is internally done by leveraging the
Content field of the
File table (typically empty). This is supposed
to be an HTML chunk despite being defined as a plain text field by the
If the captions are enabled, they can be edited directly inside the
Image list tab by clicking the Edit button.
Content is not defined, an
<h4> element with the image title is
used instead: see
templates/Includes/ImageCaption.ss for details.
Module rating system helping users find modules that are well supported. For more on how the rating system works visit Module standards
Score not correct? Let us know there is a problem