Soul Documentation
  • Greeting
  • UPDATES
    • What's new in Soul
      • Release Notes
      • Version 3.1.0 release
      • Version 3.0.0 release
    • Demo stores
      • Elegant
      • Warm
      • Dark
  • SECTIONS
    • Header
      • Announcement bar
      • Header
    • Template sections
      • A to Z brands
      • Blog posts
      • Collage
      • Collapsible content
      • Collection list
      • Collection showcase
      • Collection spotlight grid
      • Contact form
      • Custom Liquid
      • Dynamic hover blocks
      • Email signup
      • Featured collection
      • Featured product
      • Flexible content
      • Image banner
      • Image comparison
      • Image gallery
      • Image with text
      • Image with product
      • Lookbook
      • Map
      • Multicolumn
      • Multirow
      • Rich text
      • Page
      • Recently viewed products
      • Running text with image
      • Shop the look
      • Slideshow
      • Testimonials
      • Video
    • Footer
    • Popup
  • THEME SETTINGS
    • Logo
    • Colors
    • Typography
    • Layout
    • Animations
    • Buttons
    • Variant pills
    • Inputs
    • Product cards
    • Collection cards
    • Blog cards
    • Pop-ups
    • Badges
    • Social media
    • Search behavior
    • Currency format
    • Cart
    • Breadcrumb
    • Preloading screen
    • Back to top
    • Custom CSS
  • COLLECTION LIST PAGE
    • Collections list page
  • COLLECTION PAGE
    • Collection
      • Collection banner
      • Product grid
  • PRODUCT PAGE
    • Product page
      • Product information
      • Product tabs
      • Related products
  • BLOG & BLOG POST PAGE
    • Blog page
    • Blog post page
  • CART
    • Cart
  • OTHER PAGES
    • How to create a page?
    • Search page
    • Password page
    • 404 page
  • TUTORIALS & TOPICS
    • How to enable size chart on product page
    • How to enable gift wrap option on cart page
    • How to enable free shipping notification
    • How to add a countdown timer on the product page
  • Knowledge base
    • Getting started in Shopify
    • Shopify help center
    • Shopify developers platform
  • Get Support
Powered by GitBook
On this page
  • Section settings
  • Slide block
  1. SECTIONS
  2. Template sections

Slideshow

You can add a slideshow of images to your home page. In the slideshow section, you have the option to adjust the slide heights, add text and buttons and set the slides to rotate automatically.

PreviousShop the lookNextTestimonials

Last updated 4 months ago

To add this section, please follow the below steps:

  1. From your Shopify admin, go to Online Store -> Themes.

  2. Find the theme that you want to edit, and then click Customize.

  3. Click Add section and choose "Slideshow".

Section settings

Setting
Description

Layout

The layout for the slideshow:

  • Full width

  • Grid

Slide height

Determines the height of the image:

  • Adapt to first image

  • Small

  • Medium

  • Large

Desktop image padding

Creates space on the left and the right of image.

Pagination style

Choose layout for the pagination.

Auto-rotate slides

Set the slideshow to play automatically.

Change slides every

Choose how often to change slides.

Animations

Setting
Description

Image behavior

Animation for the image when scroll:

  • None

  • Ambient movement

  • Zoom in on scroll

Mobile layout

Setting
Description

Show content below images on mobile

The content displays below the images, instead of lying on the images.

Accessibility

Setting
Description

Slideshow description

Describe the slideshow for customers using screen readers.

Section padding

Setting
Description

Top padding

Determines the height of the top inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).

Bottom padding

Determines the height of the bottom inner space of the section. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).

Slide block

Setting
Description

Image

The image for this block.

Heading

The heading for this block.

Heading size

The size of the heading text:

  • Small

  • Medium

  • Large

  • Extra large

  • Huge

Heading font weight

The font weight of the heading text:

  • Regular

  • Medium

  • SemiBold

  • Bold

  • ExtraBold

  • Black

Subheading

Add the text for this block. This text appears below the heading text.

Button label

The text that displays on the button. Leave the label blank to hide the button.

Button link

The URL that you want the button to link to.

Button style

Style of the button:

  • Filled

  • Text link

  • Outlined

Desktop content position

Positions the content relative to the image:

  • Top Left - Positions the content to the top vertically and the left horizontally.

  • Top Center - Positions the content to the top vertically and the center horizontally.

  • Middle Left - Positions the content to the middle vertically and the left horizontally.

  • Middle Center - Positions the content to the middle vertically and the center horizontally.

  • Bottom Left - Positions the content to the bottom vertically and the left horizontally.

  • Bottom Center - Positions the content to the bottom vertically and the center horizontally.

Show container on desktop

Show background for the content.

Desktop content alignment

Sets the alignment of the content on desktop:

  • Left - Aligns the content to the left.

  • Center - Aligns the content to the center.

  • Right - Aligns the content to the right.

Image overlay opacity

Dims the banner image with an overlay.

Color scheme

Set the color for this slide.

Mobile layout

Setting
Description

Mobile content alignment

Sets the alignment of the content on mobile:

  • Left - Aligns the content to the left.

  • Center - Aligns the content to the center.

  • Right - Aligns the content to the right.