Creating a Slider

The newest dotCommunity themes, Modern and Bootstrap, feature a Slider includelet which displays an animated carousel of images and text. See the Voice Demo Site for an example of it in use, at the top of the page just under the menu bar.

Slider in Action

It is controlled by the Content Management System, and uses images taken from your Assets Library.

It is intended to be used at the top of the page (rather than in content or a sidebar) and so can only be selected if your theme has a Top region in the Layout tab of your page. To enable this region, go to your site's homepage in the Content Management pages, click on the Layout tab, and click the button to change the Current Template. If you select the Five Area layout you will be able to place Includelets in the Top region, which appears above the main site content. For further details on changing layouts, see the Layouts page in the documentation.

Once you have selected the Five Area layout for your page, click on the Add Includelet button in the Top region and select Slider from the list of availble Includelets.

To add an item to the slider click the Add Item button, which opens a popup window from which you can choose an image from your Assets Library (by clicking on Select Item) and adding a header and description text. Once you click on Add Item the popup window will close and your item will be added to the list in the Includelet configuration.

You can add as many items as you like in this way. From the Includelet configuration page you can change the order of items.

Slider Configuration

Once you've selected your images, click Save on the includelet config and you'll be returned to the Layouts tab for your page. You can then Preview or Publish your changes.