# Slider

### Summary

The Slider component allows your users to move through multiple panels that include images and content.

This section shows you how to add the Slider component.

Below is an example of the Slider component.

<figure><img src="/files/7EU8FOiGNz20vF1TqNuC" alt=""><figcaption></figcaption></figure>

### How to add a Slider

Step 1: Go to the page you'd like to add the Slider to (or create a new page) and in the Content tab, Components section, select Slider from the dropdown list.

<figure><img src="/files/QiuexBW8WjUlSZUWXXyK" alt=""><figcaption></figcaption></figure>

Step 2: Fill in the fields as per below.

<figure><img src="/files/KL13lfDUnRfrDbZ7yQiV" alt=""><figcaption></figcaption></figure>

1. Title - Type in the title for your 'slideshow'.
2. Slides - Use the dropdown here to add slides. You can either add slides manually (Add Slider slide) or using automation (Add Slider reference slide).
3. Background - Check this box to apply a background colour.
4. Theme - Choose the light or dark theme.
5. Vertical spacing - Add vertical spacing on the component (above, below or above AND below).

Step 3: Fill in the information for each slide - see below.

<figure><img src="/files/EpbBqaIn23UZHnZBkWcH" alt=""><figcaption></figcaption></figure>

1. Title - Add the title for *this* slide.
2. Image - Add an image for the slide.
3. Image position - Choose left or right for the image position.
4. Date - Add a date (if desired).
5. Content - Add some content about the slide.
6. Links - Add any links you'd like to include in the content section of the slide (these are displayed as buttons).
7. Add another (link) - Add extra links if desired.
8. Topics - Add in topics if you'd like the slider to include a topic tag.
9. Add another (topic) - Add extra topics if desired.
10. Theme - Select the light or dark theme.
11. Add Slider slide - Add more slides.

### Slider reference slides

You can also add 'Slider reference slides'. These slides retrieve the content automatically from an existing page.

Below is a screenshot of the fields for the Slider reference slides.

<figure><img src="/files/97i2GIm9ZruVaIH3jJdp" alt=""><figcaption></figcaption></figure>

1. Reference - Start typing the page title of the page you'd like to reference, and then select the page/content.
2. Link text - Add in link text, if desired.
3. Image position - Select right or left for the image. Note: This brings in the xxx image from the page you're linking to.
4. Theme - Select light or dark theme.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.civictheme.io/content-authoring/components/slider.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.