Navigating a large store can be overwhelming. A visual category slider at the top of the shop page helps users find their niche quickly.
To solve this, use Div Render Container Slider for Elementor.
Step 1: Dynamic Data
You can use a Loop Grid set to “Product Taxonomies” (Categories).
Customize the Item Template: Background Image set to “Term Image”, Heading set to “Term Name”.
Step 2: Slider Mode
Wrap the loop (or manual containers if you have few categories) in a Parent Container.
Enable Slider Mode.
Step 3: Styling
Set Space Between to a small value like 10px.
Set Slides Per View to 6 (Desktop) and 2.5 (Mobile).
This density encourages rapid browsing.
Pro Tips for Categories
- Free Mode: Enable
Free Mode. Users prefer to flick through categories quickly rather than snapping to each one.