Lory Slider

Carousels are a common request and an awkward thing to build from generic components, because the slide track, the visible frame and the navigation arrows all need to be separately addressable. This plugin wraps the lory slider library and exposes exactly that structure.

Components

• lory-slider — the outer component.
• lory-frame — the visible window that clips the track.
• lory-slides — the track holding all slides.
• lory-slide — an individual slide, droppable like any container.
• lory-prev and lory-next — the navigation controls, shipped with SVG arrow icons you can replace.

Options

Each component has its own extension point — sliderProps, frameProps, slidesProps, slideProps, prevProps and nextProps — so you can rename them, lock them from dragging or change their defaults independently. slideEls sets the starting slides (three by default), prevEl and nextEl accept HTML strings for custom arrows, and classFrame, classSlides, classSlide, classPrev and classNext rename the generated classes. script points at the lory build loaded when the library is not already present.

Requirements

GrapesJS v0.12.60 or higher. Install as grapesjs-lory-slider.