> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/triumph/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/triumph/template/shared-blocks/slide.md).

# Slide

Use the block to add as many slides as necessary.

## Slide

{% hint style="success" %}
The *Slide* block includes additional blocks to add content overlaid on an image, such as [<mark style="color:$primary;">Logo</mark>](/triumph/template/shared-blocks/slide/logo.md), [<mark style="color:$primary;">Headings</mark>](/triumph/template/shared-blocks/slide/headings.md), [<mark style="color:$primary;">Button</mark>](/triumph/template/shared-blocks/slide/button.md), and [<mark style="color:$primary;">Note</mark>](/triumph/template/shared-blocks/slide/note.md).
{% endhint %}

**Link**\
Redirect customers to a specific page when they press a banner or call-to-action button.

**Open link in new tab**\
Enable the option to open a page in a new tab instead of the current one.

### Media

Choose the media type using the '**Type**' setting:

* **Image**\
  Add images for different devices:
  * **Image** – Default image.
  * **Image on tablet** – Optional tablet version.
  * **Image on mobile** – Optional mobile version.
* **Video**\
  Use a video instead of an image.

**Video source:**

* **Uploaded** – Select a video from your files.
* **External URL** – Paste a YouTube or Vimeo link.

Additional options:

**Preview image**\
Set a cover image for the video.

**Autoplay video**\
Plays the video automatically (muted by default).

**Show play / Pause button**\
Displays a control button on the video.

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2FaEgkDXd2gMxh0x3l6CDv%2Fslideshow_slide%20play%20bttn.png?alt=media&amp;token=65722961-1f68-4756-89f2-53962bceec94" alt=""><figcaption></figcaption></figure>

**Muted**\
Turns off sound *(available when autoplay is disabled)*.

### Overlay

Add a color overlay on top of the image or video:

* **Opacity** – Adjust transparency (0–100%).
* **Color** – Choose the overlay color.

**Opacity**\
Set the color's transparency. Specify a color in the corresponding palette.

* **0%** - Turns off the color overlay.
* **100%** - Completely covers an image with the color.

### Content layout

**Show inspector for editor mode**\
Displays a visual guide around the content while editing. This is visible only in the editor, not on the live site.

**Width on desktop**\
Set the width of the content (30%–100%).

**Horizontal position on desktop**\
Control horizontal placement:

* 0% – Left
* 50% – Center
* 100% – Right

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2F3dLpZdrTLKCtadStRJVq%2Fslideshow_slide%20content.png?alt=media&amp;token=f10a511a-bcbc-4dff-b8b1-a2699710099a" alt=""><figcaption></figcaption></figure>

**Vertical position**\
Adjust vertical placement on each device (0% - top, 100% - bottom):

* Desktop
* Tablet
* Mobile

<figure><img src="https://4126621502-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkpREZeVZogNLjx09og4O%2Fuploads%2Fx6hbHv5sZDt9qgCGya4G%2Fslideshow_slide%20vertical%20position.png?alt=media&amp;token=32d4f96b-f355-4309-8c69-bb5e73392211" alt=""><figcaption></figcaption></figure>

**Alignment**\
Set the text alignment to Left, Center, or Right.

**Alignment on mobile**\
Set text alignment for mobile devices.