> For the complete documentation index, see [llms.txt](https://story.groupthought.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://story.groupthought.com/sections/story-sections/slideshow.md).

# Slideshow

Showcase your brand and products with Story's powerful slideshow section. Customize your slides to promote products on both mobile and desktop devices.

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

### Mobile image

Portrait images can be used for mobile devices. Each slide can have a different mobile image:

<figure><img src="/files/4laDLn88wv2knHObs8mN" alt=""><figcaption></figcaption></figure>

### Modern design elements

Creative design options built-in. Simply add section padding to the top and width for a modern rounded style banner:

<figure><img src="/files/FlzquWeznZS3kf2hEt0V" alt=""><figcaption><p><strong>Slideshow Section settings</strong></p></figcaption></figure>

For the modern rounded effect:

1. Set the slideshow section spacing width to **Full width padding**.
2. Use the **Rounded** option under Rounded images in the Theme settings -> Layout

<figure><img src="/files/2qBMhOtNlvYpirIlhNep" alt=""><figcaption><p><strong>Theme settings</strong></p></figcaption></figure>

For images without rounding, set the section width option to **Full width**:

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

### Transparent header

Blend your slideshow images into the header area with the transparent header feature:

<figure><img src="/files/bdgemmgdrFVFybHewTBp" alt=""><figcaption><p><strong>Header settings</strong></p></figcaption></figure>

1. Enable with the checkbox in the Header settings under Transparent header.
2. Add an alternate logo that works best for the transparent header effect. In our example, we have a white Alternate logo and the standard header logo is black (header settings).
3. In the Slideshow section settings, use the **Full width** option for the transparent effect to work.

<figure><img src="/files/N6hSECJfS12m96RZrT2x" alt=""><figcaption><p><strong>Slideshow Section settings</strong></p></figcaption></figure>
