Snippets Library: Carousels
What is a carousel?
The carousel snippet offers the option to display images, text, etc. in a format that can automatically cycle through selections or use arrows to manually move from item to item.
Creating an image carousel
On the page you're editing, click on the Snippet icon in the WYSIWYG Toolbar.
Select the carousel and click Insert.
Replace the default images by clicking them and then clicking the Insert/Edit Image icon in the WYSIWYG Toolbar.
Click the select file icon to locate your images you want to include in the carousel.
Once your image has been located, click Save.
After the image has been selected, remember to add an Alternative description and/or image title.
Replace default text with your own. Link the text if necessary.
Click Save to preview carousel.
Adding and deleting carousel rows
To add additional rows, click the add row buttons in the quick icon menu.
Or right click on the preferred row and go to Row→ Insert Row After or Insert Row Before.
To delete a row, select the delete row button in the quick icon menu.
Or right click on the preferred row and go to Row→ Delete Row.
Ways to style a carousel
Add classes in the table properties of the accordion to create different styles.
Helper Class: ext-btns
Position buttons outside of the carousel content
Helper Class: autoplay
Sets the carousel to automatically rotate through the slides.
Helper Class: controls-bottom-right
*Works in tandem with autoplay. Positions the pause/play controls at the bottom right side of the carousel.