In this article you will learn about the Carousel app and how to set it up. This app is used to showcase a series of items with a paginated index to browse between them. They also have a title and footnote each of them. It can be used to display a catalog of products, for example.

First step

Log into you Breezi site. Now go to the shelf and click on Apps, which opens the App Store. Locate the Carousel app, and on the right side, click and drag “Install New” to a column of your layout.

Once it loads, it may look like the following image.

Change Text

Let’s start customizing it. Begin we the app title.

Double click on it to edit the wording and format. You can also modify its style dot.

Then you can also edit the other two lines. To do so, double click on them and customize it with the edit-in-place toolbar.

Change the Image

The thumbnail on the right can be switched to a custom image you provide. To change it, hover over it and notice how your mouse icon changes to a pencil, indicating you can edit.

Double click it and the image editor will open.

This image can be either from your computer, or from a public URL.

Once you upload your image, you can add an “Alt” attribute. It should be a written description of the image. This text will help search engines identify what the image is, since they can’t interpret pictures.

Add/Remove/Reorder Entries

So far so good. You now have your first item fully set. But the carousel allows for more items. To insert another one, click on the plus icon on the app toolbar.

Now you have another set of image and text that can be edited just the same.

You can add as many entries as you need. But what if you don’t need any of your items anymore? You can remove entries by clicking on the small “X” right between the “Footnote” and the app “pagination”.

There’s one more thing to do here, in case you want to change the order in which your items appear. To reorder your items, click on the arrows icon right next to the “Remove” button.

The screen that loads will allow you to drag and drop items as you need to show them.

Edit settings

And lastly, you have the settings options.

Clicking the wrench icon will open the settings for the carousel.

The first option lets you set how many entries you want to show at the same time. Throughout this article we have used only one item at the same time, but here’s how it would look if we select 2, for example.

Style propagation and geometry propagation is turned on by default. But you can disable it here to keep this app independent of other versions. Learn more in the articles linked before.

If there’s something missing, please let us know below!