This documentation refers to a Gravstrap obsolete release. Please consider to upgrade to the new release

The Gravstrap Carousel component handles the Bootstrap Carousel component.

The carousel component is defined by the following Yaml code:

gravstrap:
    carousel:        
        carousel1:
            id: bscarousel
            previous_label: Previous
            next_label: Next
            items:
                0:
                    image: screenshot.jpg
                    caption: an awesome image
                1:
                    image: screenshot.jpg
                    caption: another awesome image

This code must be added to the page where you need to display the component.

id property

The id mandatory property defines the same HTML property for the carousel. If you need more than one carousel on the same page, be sure to add a different id for each carousel you define.

previous_label property

The previous_label mandatory property defines label text for the previous button.

next_label property

The next_label mandatory property defines label text for the next button.

button_caption property

The button_caption property defines the toggle element's caption.

items property

The items property is an array which defines the images elements displayed in the carousel component.

item's image property

The item's image mandatory property defines the image name displayed in the carousel.

item's image property [optional]

The item's caption optional property defines the caption shown on the related image.

Render the carousel component

Add the following code to the template where you need to render the carousel component:

{{ gravstrap.carousel1 }}

Next Post Previous Post