Product Slider BlockFree downloadMenu
Pro
Black over-ear wireless headphones on a white background
Coral red wireless headphones lying on a polished red wooden surface
White wired headphones with brushed metal ear cups on a yellow background
White on-ear wireless headphones on a white background
Black open-back headphones on a dark textured surface, in black and white
Grey-dial steel chronograph with gold hands and a link bracelet on polished wood
Open brass pocket watch with a white dial, resting on its chain on pale fabric
Unlabelled white pump bottles and jars beside stacked white towels

Coverflow effect for WooCommerce product sliders

Soft-shell headphones

€219

Drag it, or click a slide at the side.

One product faces you. Those beside it turn away and step back in space, with their pictures seen at an angle. Dragging brings each one round to the front.

It has a clear hierarchy: one thing now, and the others waiting. It also keeps the neighbours in sight, which a one-at-a-time slider cannot do.

Pro

Comes with Pro. Pro starts at $19 a year.

Put it on

Record sleeves and album art
Square covers are what this layout was first remembered for.
Book covers
A rack of fronts, facing you one at a time.
Products worth one moment each
Limited sets where every item deserves to stand in front.

Keep it off

Comparing several at once
Only the middle is legible. For comparing, a plain row is much better.
Narrow columns
The turned covers need room at the sides. In a sidebar there is none.

Settings

The names here are gpu slider's, which draws it. The defaults on the sliders are its defaults.

Black over-ear wireless headphones on a white background
Coral red wireless headphones lying on a polished red wooden surface
White wired headphones with brushed metal ear cups on a yellow background
White on-ear wireless headphones on a white background

Soft-shell headphones €219

50How far the side covers turn, in degrees.
0.4How far they step back.
1How many slides away the full turn is reached.

In the block, in three steps

  1. Add the Product Slider block to your page, and under Products choose hand-picked products.
  2. Pick Coverflow under Effect. The block centres the row for it. It comes with Pro.
  3. Click on a cover at the side. It should come forward, because the click goes to what you see. Check the same on a phone by tapping.

Close relatives

In a sample shop

Blocks that can use it

Where it goes in a shop: on a hover image swap, in a related products row or in a slider on autoplay. Questions about browsers and motion are in the FAQ.

Coverflow is part of Pro, and the free plugin has fade, distance, ripple, zoom, stretch and parallax to start with. Pro starts at $19 a year.

Get the free plugin