Product Slider BlockFree downloadMenu
Pro

Swirl transition for WooCommerce product sliders

Overhead view of black coffee in an orange polka dot cup on a terracotta and white backdrop
Roasted coffee beans spilling from a gold paper bag onto a pale mint surface
Overhead view of an open white bag of roasted coffee beans on white
Overhead view of black coffee in a white cup on a square saucer, half on white wood and half on black
Espresso in a pale blue cup on a bamboo saucer at the edge of a marble table
Two small grey stoneware espresso cups on a neutral surface

Orange dot cup and saucer

€24

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

A vortex twists the picture away and the next one twists in, turning the same way throughout. It never winds back, so it reads as one continuous stir.

The middle of the frame moves little while the outer parts travel far, so a centred product stays recognisable a long way into the turn.

Pro

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

Put it on

Coffee, tea and syrups
Anything you stir. A spoon through a cup is the picture in everyone's head.
Round products
Plates, vinyl, watch faces and pizza stones look right turning around their own centre.
Playful sweet brands
It has some circus in it, and ice cream can use that.

Keep it off

Long horizontal products
A sofa photographed end to end gets wrung like a towel.
People prone to motion sickness
A spinning full-screen picture is one of the stronger triggers. Keep this one away from huge heroes.

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.

Overhead view of black coffee in an orange polka dot cup on a terracotta and white backdrop
Roasted coffee beans spilling from a gold paper bag onto a pale mint surface
Overhead view of an open white bag of roasted coffee beans on white
Overhead view of black coffee in a white cup on a square saucer, half on white wood and half on black

Orange dot cup and saucer €24

1300A turn wants about a second and a bit. Quicker gets dizzy, slower looks like a screensaver.

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 Swirl under Transition. It comes with Pro.
  3. Try it with reduced motion turned on in your system settings: the slider should move without the spin, which is what those visitors asked for.

Close relatives

In a sample shop

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.

Swirl 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