# Slideshow

The **Slideshow** section allows you to showcase multiple slides with images, text, and buttons in a carousel format. It’s ideal for highlighting promotions, featured collections, announcements, or storytelling visuals on your homepage or landing pages.

This section can be **added, removed, and rearranged** within templates.

<figure><img src="https://content.gitbook.com/content/9icwdCUv3B94Yb9tmqHW/blobs/O2E9TymTyof6rvNQnjeq/image.png" alt=""><figcaption></figcaption></figure>

***

#### How to Configure the Slideshow

1. In Shopify admin, go to **Online Store → Themes**.
2. Click **Customize** next to the **Elemento** theme.
3. In the theme editor, navigate to the desired page template (e.g. Home page) using the top preview dropdown.
4. In the left sidebar, click **Add section**, then select **Slideshow**, or locate it if it’s already added.
5. Add slides by uploading images, and customize each slide’s content such as heading, subheading, buttons, and links.
6. You can **drag and drop** this section to reorder it on the page.
7. Click **Save**.

#### Section Settings

| Setting          | Type                                                        | Description                                                                                                                         |
| ---------------- | ----------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
| **Slide height** | Select (`Adapt to first image`, `Small`, `Medium`, `Large`) | Determines the height of the slideshow. If set to `Adapt to first image`, all slides will adjust to match the first image's height. |

***

#### Blocks

Each **Slide** block represents a single slide in the slideshow. Multiple slides can be added and reordered.

**Slide Block Settings**

| Setting                  | Type                               | Description                                                                      |
| ------------------------ | ---------------------------------- | -------------------------------------------------------------------------------- |
| **Image**                | Image picker                       | Upload or select the background image for the slide.                             |
| **Backdrop opacity**     | Range                              | Controls the overlay darkness between the image and text for better readability. |
| **Overlay settings**     | Group                              | Settings related to the overlay content display.                                 |
| **Maximum width**        | Range                              | Sets the maximum width of content within the slide.                              |
| **Vertical alignment**   | Select (`Top`, `Middle`, `Bottom`) | Aligns the slide content vertically.                                             |
| **Horizontal alignment** | Select (`Left`, `Middle`, `Right`) | Aligns the slide content horizontally.                                           |
| **Color scheme**         | Color scheme selector              | Controls the text and button color scheme.                                       |
| **Heading**              | Text                               | Main title text displayed on the slide.                                          |
| **Content**              | Rich text                          | Supporting text content or description.                                          |

**Button Settings (within Slide)**

| Setting   | Type | Description                                         |
| --------- | ---- | --------------------------------------------------- |
| **Label** | Text | The text that appears on the call-to-action button. |
| **Link**  | URL  | The destination URL or page the button links to.    |