# Creating carousels

> Carousels are content elements that allow you to structure your content into steps that are easier for visitors to understand and navigate.

Source: https://www.zenplates.co/documentation/overview/creating-carousels (Overview › Using the article editor)

In this guide we'll focus on how to create interactive carousels within the content of your article using the Zendesk article editor.

Because the carousel script is built into all of our themes, there are no additional scripts to include or code to write.

## Adding carousels to article content

The first step is to create a [numbered or bulleted list](https://support.zendesk.com/hc/en-us/articles/4408839186586-Help-center-editor-toolbar-reference) in your article where each list item contains the content that will be contained within its own carousel slide. If you have a lot of content to display in each slide, or content that contains headings and other custom elements, we recommend using the [HTML](https://support.zendesk.com/hc/en-us/articles/4408839186586-Help-center-editor-toolbar-reference) (source code) view within the article editor.

The list itself will be a `<ol>` or `<ul>` element, with child list items represented as `<li>` elements.

Once you've added all of your content to the list add a class name of `.js-carousel` to the list to convert it into an interactive carousel. For example:

```html
<ul class="js-carousel">
  <li>...</li>
  <li>...</li>
  <li>...</li>
</ul>
```

Where:

- &#x20;The `.js-carousel` class name specifies that we'd like to convert this list into an interactive carousel.
- &#x20;The content of each list item is converted into its own carousel slide.

This approach ensures a separation between your content and how it's displayed to visitors. If you ever decide to disable carousels for a given list, change themes or export your content you'll see a simple, uncontaminated list.

## Using a custom micro-template

Or for the more adventurous among you, you can create your own custom [micro-template](https://www.zenplates.co/documentation/customization/using-micro-templates).

A custom template allows you to change not just the appearance of the carousels, but their underlying HTML structure and behavior.