Product Slider BlockFree downloadMenu
Pro

Fluted glass transition for WooCommerce product sliders

Two unlabelled cream pump bottles on an orange and red backdrop with diagonal light
White spray bottles beside a dried palm fan and stone on a blue and tan backdrop
Three unlabelled amber glass bottles with black pumps and a dropper on textured white
Glass serum bottles and a dark jar in a shaft of light on a sage backdrop
Burgundy serum bottle with a blank label and raised dropper on a bamboo-lidded jar
Hand holding an unlabelled white tube against a solid pink background

Daily lotion duo

€34

Drag the picture sideways and hold: you can stop in the middle of the move.

Straight vertical ribs of reeded glass slide over the picture, each a small cylinder lens with a highlight and a dark seam. The ribs turn to the next product from left to right, then the glass leaves.

It is the bathroom window of transitions: a real material most people have looked through, which makes it feel more physical than a shader usually does.

Pro

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

Put it on

Skincare and fragrance in glass
Ribbed bottles and frosted jars are the same material as the effect.
Interior and lighting shops
Reeded glass is already in the room those customers are furnishing.
Clean compositions with one object
The ribs break up the picture, so it needs to be simple to survive.

Keep it off

Busy patterned products
Stripes through a pattern makes moiré, and it gets hard to look at.
Small sliders
Under about 400 px wide there are too few ribs to read as glass.

Settings

In the block the time of a move is a setting on every transition. Everything else on this list comes from gpu slider, which draws it.

Two unlabelled cream pump bottles on an orange and red backdrop with diagonal light
White spray bottles beside a dried palm fan and stone on a blue and tan backdrop
Three unlabelled amber glass bottles with black pumps and a dropper on textured white
Glass serum bottles and a dark jar in a shaft of light on a sage backdrop

Daily lotion duo €34

1500The glass arrives, works, and leaves. Three acts need around a second and a half.

In the block, in three steps

  1. Add the Product Slider block to your page, and under Products choose one category.
  2. Set Layout to One at a time, then pick Fluted glass under Transition. It comes with Pro.
  3. Check it on the width it will really have on your page. If the ribs look like stripes, not glass, the slider is too narrow.

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.

Fluted glass 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