Slide Show Section
Intro
Slideshow sections are still a favorite among prop companies—even if modern web designers might roll their eyes. Truth is, most visitors don’t make it past the first slide before scrolling down.
Slideshows also take a toll on performance: they add bandwidth, slow page speed, and can nudge your site down in Google rankings. On mobile, visitors are even less likely to swipe through them. In short, they’re pretty but not practical—especially above the fold.
Still, we know you love them. So here ya go.
Pro Tip: Want a sleek, modern “above the fold” section that includes an H1 tag and isn’t a slideshow or banner? Contact us.
When to Use
Use a slideshow at the top of your page to quickly introduce your business to customers. In a few words, tell them what you do and give them one or two call to action buttons to sign up and view your inventory. Subsequent slides allow you to feature different inventory categories, artists, or pages on your website.
This should be the first or second section on the page because the title uses an H1 tag.
The alternative is the Banner Section, which also uses an H1 tag, or a Markdown Section which allows you to use any tag(s).
Data Structure
Position
Where the section appears in the order of all page sections.
Class
The slide show offers four different layouts which are the section Class:
- Default - 50/50 image to text content
- Whitespace - 50/50 image to text content but with white-space / padding around the slideshow
- Fullscreen - a fullscreen background image with text on top
- Image Only - no text. This option was our initial slideshow template for our early websites before we added text
Position
Where the section appears in the order of all page sections.
Slides
A slideshow is composed of up one or more slides. It's essentially a section that is a group of other sections (the slide sections).
Pro Starter Plan subscribers can have one slideshow section per Sections template page with up to two slides.
Pro Standard Plan subscribers can have unlimited slideshow sections with up to ten slides.
Slide Data Structure
Title
This is an H1 tag.
Description
Text below the title that uses a P tag. Example "Sign up to shop our collection of props".
Description when logged in This is usually only used for the first slide. Example "Shop our collection of props". Notice the "Sign up to" part is omitted because the user is already logged in.
Main Button Text
The text for the CTA button.
Main Button Path
The pathname of the page clicking the CTA button links to.
Main Button Class
See the available button classes (coming soon).
Alt Button Text Optional
The text for the alternate CTA button that appears to the right of the previous button.
Alt Button Path
The pathname of the page clicking the CTA button links to.
Alt Button Class
See the available button classes (coming soon).
If the Alt Button is used, then it becomes the primary button when the user is logged in, and the Main Button is hidden.
This is usually relevant on the first slide when the Main Button is to "Sign Up" and the Alt Button is to "Browse Inventory". When the user is logged in, the "Sign Up" button disappears and "Browse Inventory" becomes the primary CTA.