Slideshow

Pipeline's hero-style slideshow section with support for mobile and desktop devices

Showcase your brand and products with Pipeline's powerful slideshow section. Customize your slides to promote products on both mobile and desktop devices.

Desktop image setting

Mobile image

Portrait images can be used for mobile devices. Each slide can have a different mobile image:

Mobile image setting

Tip: Use the Image height setting to view the entire image without any cropping. Especially helpful for mobile devices. Combined with turning off Parallax images in the Theme settings -> Layout under Animations will provide the best results.

Prioritize image loading

When checked, the first image of the slideshow will be prioritized ahead of other theme files. This ensures there's an image displaying in the first fold when shoppers first visit:

Section settings

Tip: Check this box for only the first section on your homepage. Other sections on the page should remain unchecked.

Multiple buttons

Add the buttons block and configure up to three buttons placed horizontally:

Transparent header

Blend your banner image with the header area:

Set the Padding top range slider to 0px (none) for best results:

In the Header section settings, enable Transparent header on the homepage:

Also add an Alternate logo that works best with your images. In our example, we've added a white alternate logo. The regular logo is black.