Categories and subcategories in shopping experiences

by weedesign

Rating: no rating ( write a review )

Downloads: <10

Displays categories and subcategories as an image grid in Shopping Experiences. Automatic subcategories or a hand-picked selection, three layout styles, live preview while editing.

Free

Compatible with:

6.6.0.0 - 6.7.13.1

Includes:

All updates

During the subscription all released updates are included for free

Support from the Extension Partner

In case you have any problems with your extension you can always ask the Extension Partner for help.

Description

Highlights

Subcategories of the current category, shown automatically on every category page
Or a hand-picked selection of categories in an order you set yourself
Three styles: name below the image, name over the image, or as a card
Ratio, colors, radius, gap and column classes per breakpoint are configurable
Live preview with real categories directly in the editor

Features

Own block category in the block overview, with a matching block and element
Automatic mode: subcategories of the category currently being viewed
Fixed parent category selectable, also works on pages without category context such as the home page
Optional fallback to the top level categories of the sales channel navigation
Manual mode: hand-picked categories in an order set by dragging

Only active categories; categories hidden from the navigation are skipped by default and can be included
Sorting by category tree order, name A to Z or name Z to A, with an optional maximum number
Three layout styles: name below the image, name over the image with gradient overlay, or card
Image, name and description can each be shown or hidden
Image ratio 1:1, 4:3, 3:2, 16:9 or original, with cover or contain scaling
Placeholder with the first letter of the name for categories without an image, or a hidden image area
Color pickers for name, card background, card border, overlay, overlay text and headline
Border radius, gap, text alignment and an optional headline as H2, H3 or H4
Bootstrap column and row classes for items per breakpoint, links can open in a new tab
Live preview with real data, responsive thumbnails, Twig blocks for theme overrides, German and English

Show more Show less

About the Extension

The plugin adds a block and an element to the Shopping Experiences editor that renders categories as an image grid. The block sits in its own category in the block overview, so it is quick to find.

There are two ways to fill the grid. In automatic mode it shows the subcategories of the category that is currently being viewed, so one layout serves every category page. Selecting a category in the configuration overrides this and always shows that category's children, which also covers pages without a category context such as the home page. If neither applies, an optional fallback displays the top level categories of the sales channel navigation. The second mode is a manual selection: pick the exact categories and drag them into the order you want.

Only active categories are output. Categories that are hidden from the navigation are left out by default and can be included with a switch. The order follows the category tree, or the category name from A to Z or Z to A, and a maximum number caps how many entries appear.

Three layout styles are available: name below the image, name over the image with an adjustable gradient overlay, and a card with its own background and border. Image, name and description can each be turned off. The image ratio can be set to 1:1, 4:3, 3:2, 16:9 or left at the original, scaling switches between cover and contain, and categories without an image either get a placeholder with the first letter of their name or drop the image area entirely.

Name, card background, card border, overlay, overlay text and headline colors are set with color pickers. Border radius, gap, text alignment and an optional headline as H2, H3 or H4 complete the styling. The grid runs on Bootstrap column classes, so the number of items per breakpoint is a text field, and extra row classes can be added when needed.

While you edit, the element in the administration loads real categories and mirrors the configuration, including images, colors and the selected style. In the storefront, images are output as responsive thumbnails, links use the regular category URLs so link categories and external targets keep working, and every card carries an aria-label with the category name. The markup is wrapped in Twig blocks, which lets a theme override individual parts.

Names and descriptions follow the language of the sales channel. Texts for the administration and the storefront are included in German and English. When the plugin is uninstalled, the blocks it created are removed unless you choose to keep the data.

The plugin adds a block and an element to the Shopping Experiences editor that renders categories as an image grid. The block sits in its own category in the block overview, so it is quick to find.

There are two ways to fill the grid. In automatic mode it shows the subcategories of the category that is currently being viewed, so one layout serves every category page. Selecting a category in the configuration overrides this and always shows that category's children, which also covers pages without a category context such as the home page. If neither applies, an optional fallback displays the top level categories of the sales channel navigation. The second mode is a manual selection: pick the exact categories and drag them into the order you want.

Only active categories are output. Categories that are hidden from the navigation are left out by default and can be included with a switch. The order follows the category tree, or the category name from A to Z or Z to A, and a maximum number caps how many entries appear.

Three layout styles are available: name below the image, name over the image with an adjustable gradient overlay, and a card with its own background and border. Image, name and description can each be turned off. The image ratio can be set to 1:1, 4:3, 3:2, 16:9 or left at the original, scaling switches between cover and contain, and categories without an image either get a placeholder with the first letter of their name or drop the image area entirely.

Name, card background, card border, overlay, overlay text and headline colors are set with color pickers. Border radius, gap, text alignment and an optional headline as H2, H3 or H4 complete the styling. The grid runs on Bootstrap column classes, so the number of items per breakpoint is a text field, and extra row classes can be added when needed.

While you edit, the element in the administration loads real categories and mirrors the configuration, including images, colors and the selected style. In the storefront, images are output as responsive thumbnails, links use the regular category URLs so link categories and external targets keep working, and every card carries an aria-label with the category name. The markup is wrapped in Twig blocks, which lets a theme override individual parts.

Names and descriptions follow the language of the sales channel. Texts for the administration and the storefront are included in German and English. When the plugin is uninstalled, the blocks it created are removed unless you choose to keep the data.

Details

Available: English, German
Latest update: 1 September 2026
Publication date: 1 September 2026
Version: 2.0.0
Category: Menu + category

Resources

Reviews (0)

Write a review

If you downloaded this extension you can write a review in the Shopware Account.

Write a review

No reviews found.

About the Extension Partner

weedesign

See all extensions

Partner Status

Shopware
Extension Partner

Details

Ø-Rating: 4.9

Average rating of 4.9 out of 5 stars
Partner since: 2019
Extensions: 57

Support

Based in: Germany
Speaks: German, English
Response time: Very quickly