Slideshow

Copy

Open in ChatGPT

Ask ChatGPT about this page

Open in Claude

Ask Claude about this page

The Slideshow dynamically displays multiple images or content in sequence, commonly used to grab attention, highlight promotions, or tell a visual story.

1. Section Components

Section	Slideshow	Displays multiple images or content in sequence.
Available blocks	Slide	Add an individual image/video slide to the section.
Available blocks	Media with Text	Add a clean text-and-image split design.

2. Location & Setup

To add & set up the Slideshow section:

Open the Shopify Theme Editor (Online Store > Themes > Customize).
Decide where you want to place the new section in Template.
Click "Add Section".
Select "OT: Slideshow (#number of variant)".

3. Highlight Features

Dynamic image & video display: Showcase multiple images or videos in sequence with carousel effects to grab attention and tell your brand story.
Flexible layouts (5 variants): Choose from 5 ready-made slideshow layouts, each designed for different storytelling and promotional needs.
Advanced layout options: Use "Media with Text" slides to highlight products or stories with a clean text-and-image split design.

4. Common Use Cases

🤔 How to set up Slideshow?

STEP 1: Add the section

Add Slideshow section to your desired position.

STEP 2: Add & customize Slide blocks

Under Slideshow section, add Slide blocks and open its settings panel to set up:

Upload a high-quality Image optimized for desktop and mobile.
Add Heading, Subheading, and optional descriptive text.
Add a Side link, so when users click on the banner, it will navigate to that link.
Add up to two buttons per slide, customizing labels, links, and styles.
Adjust the Desktop and Mobile look, including slideshow position, content alignment, and so on.

STEP 3: Click "Save".

🤔 How to add carousel animation and pagination to your Slideshow?

STEP 1: Click on the Slideshow section to open its settings panel

STEP 2: Adjust the setting, depending on your need

Setting name	Purpose
Enable auto-play	Turn on to set a slide transition autoplay.
Change slides every	Adjust the duration between each slide change (from 5-10s)
Next/Previous Arrows	Enable to add left and right arrows to the slideshow.
Pagination	Choose your desired pagination style from the list: None: No pagination indicators. Dots: Simple dot indicators for slide navigation. Bars: Bars showing slide progress.
Transition style	Choose a Transition style (Slide or Fade).

STEP 3: Click "Save".

🤔 How to use videos to display in Slideshow?

To showcase videos in Slideshow, follow this:

STEP 1: Add the section

Add OT: Slideshow #5 section to your desired position.

STEP 2: Add & customize Slide blocks

Under OT: Slideshow #5 section, add Slide blocks and open its settings panel to set up:

Upload a video under Shopify-hosted video or embed a video from URL.
Adjust other block elements such as headings, buttons, and layouts.

STEP 3: Click "Save"

🤔 How to create a Media with Text slide layout?

Use this layout to highlight a product or story with text displayed separately from the image for a clean and modern look.

STEP 1: Add a new Media with Text block to the OT: Slideshow #5 section.

STEP 2: Upload the main Image for the slide. (Add a link to the Image link field, so when users click on the banner, it will navigate to that link.)

STEP 3: Customize the content