Brickspace Lab
Contact usContact ShopifyTry a theme
Keystone
Keystone
  • Keystone documentation
  • Getting started
    • Getting started with your theme
      • Keystone overview
      • Theme Colors Setup
      • Theme Typography Setup
      • Theme Borders Setup
      • Product prices
  • Guides
    • Products
      • Product badges
      • Product subtitles
      • Custom content for tables
      • Replace "Add to cart"
      • Disable quick add
    • Wholesale
      • Wholesale basics
      • Account restrictions
    • Color and option swatches
    • Device specific visibility
    • Discount popups
  • Templates
    • Templates
      • Collection template
      • Product template
      • Blog template
      • Article template
  • Sections
    • Sections
      • Global Sections
        • Header
        • Footer
        • Navigation links
        • Announcement
        • Cart drawer
        • Account drawer
        • Search drawer
        • Menu drawer
      • Media & Promotional
        • Slideshow
        • Video
        • Split banner
        • Marquee
        • Image hotspot
        • Countdown
        • Discount
        • Banner
        • Slider
        • Testimonial slider
        • Search banner
      • Product & Collection Displays
        • Product grid
        • Product slider
        • Product table
        • Product comparison
        • Recently viewed
        • Collection list grid
        • Collection list slider
        • Featured product
        • Comparison table
      • Content & Marketing
        • Rich text
        • Blog posts grid
        • Testimonial grid
        • Logo list
        • Icon grid
        • Collapsible content
        • Tabs
        • Collage
      • Utility & Custom
        • Custom liquid
        • Tool tip
        • Store locater
      • Forms & CTAs
        • Email sign-up
        • Sign-up form
        • Contact form
  • General
    • General
      • Changelog
        • v1.3.0
        • v1.2.0
        • v1.1.0
        • v1.0.1
        • v1.0.0
      • Known issues and troubleshooting
      • Cloning a demo theme
Powered by GitBook
On this page
  • Section overview
  • Section Settings
  • Block Settings

Was this helpful?

Edit on GitHub
  1. Sections
  2. Sections
  3. Product & Collection Displays

Product slider

Section overview

The Product slider section displays a customizable horizontal slider of products from a selected collection, optionally mixed with content blocks.

Common Use Cases

  • Showcasing featured products on the homepage

  • Highlighting new arrivals or seasonal collections

  • Creating a "You may also like" section on product pages

  • Building promotional sections that combine content and product cards

Usage Tips

  • Select a collection with sufficient products to create a meaningful slider

  • Consider mobile users by adjusting the card width settings appropriately

  • Use content blocks strategically to introduce or explain the product collection

  • For best visual results, use images of consistent dimensions throughout the collection

Section Settings

Setting
Description

Collection

Select the collection to display products from

Total items

Maximum number of products to display

Heading

Main heading for the section

Content

Descriptive text for the section

Button label

Text for the optional button

Button url

URL the button links to

Top spacing

Amount of padding above the section (in pixels)

Bottom spacing

Amount of padding below the section (in pixels)

Color scheme

Background and text color combination for the section

Color border

Color style for section borders

Color button

Style and color for the section button

Border position

Position of borders around the section

Size

Width of the section content

X alignment

Horizontal alignment of section content

Arrow alignment

Horizontal alignment of slider navigation arrows

Card width mobile

Width of product cards on mobile devices (as a fraction of 12)

Card width desktop

Width of product cards on desktop devices (as a fraction of 12)

Enable margin

Apply horizontal margin to the section

Enable split

Split section into a sidebar (1/3) and content area (2/3)

Visibility

Control whether section appears on mobile, desktop, or both

Enable arrows

Show navigation arrows for the slider

Enable indicators

Show position indicator dots for the slider

Enable scrollbar

Show scrollbar for the slider

Block Settings

Content Block

The Content block adds text, media, and button elements to the product slider. This can be used to introduce or complement the product collection.

Limit: 1 block

Setting
Description

Heading

Block heading text

Content

Descriptive text for the block

Button label

Text for the block's button

Button url

URL the button links to

Image

Primary image to display

Image background

Background image to display behind content

Video

Video to display

Enable video autoplay

Automatically play video when visible

Enable mute button

Show a button to toggle video sound

Enable video loop

Continuously loop the video

Minimum height

Minimum height for the block (in pixels)

Enable padding

Apply padding around block content

Color scheme

Background and text color combination for the block

Color text

Override text color setting

Color border

Border color style for the block

Color button

Style and color for the block button

Enable gradient

Apply a gradient effect to the background

Y alignment

Vertical alignment of content within the block

X alignment

Horizontal alignment of content within the block

Text position

Position text above or below the media

Last updated 21 days ago

Was this helpful?