Jscriptz Subcats

View Demo

Jscriptz Subcats replaces boring category links with responsive, card-based subcategories that showcase images auto-populated from your product collection, or set in the admin. Full design control right from your Magento admin!

Benefits for Merchants

• Higher engagement – Shoppers see visual pathways instead of plain text lists.

• Faster discovery – Product images instantly explain what’s inside each category.

• On-brand layouts – Presets get you close; detailed options get you perfect.

Perfect For

• Stores with deep category trees that feel “flat” or hard to navigate.

• Fashion, beauty, electronics, lifestyle, or any catalog where visuals sell.

• Merchants using Hyvä or Luma who want more control over category presentation without custom coding.

Why You’ll Love It

Shoppers don’t browse plain text. They browse visuals.
With Jscriptz Subcats, every parent category can display its child categories as modern, clickable “cards” featuring:

• Category image or smart product image fallback
• Fully customizable styling that matches your theme in minutes


All without touching a line of template code.

---

Key Features

 Elegant Subcategory Cards

• Automatically shows all active child categories of the current category.

Or choose exactly which subcategories to display using a category tree selector in Catalog → Categories → Jscriptz Subcats.

Renders a clean, responsive grid that works beautifully on desktop and mobile.

Control behavior per subcat:

Use the category image or enable a config switch to:

Pick a random product image from products assigned to that subcategory.

Ensures your cards always look alive, even if category images weren’t manually set.

 Design Controls in Admin

Configure the look and feel under:
Stores → Configuration → Jscriptz → Subcats

You get fine-grained control over:

•Text / link color
•Card border (stroke)
•Rounded corners (border-radius)
•Padding & spacing
•Card background
•Image border (stroke)


Hover / transition effects for:

•Card
•Image
•Text


All options are per store view, so you can style differently for each storefront.

 Design Presets (Instant Styling)

No design degree required. Start with prebuilt presets and tweak:

Theme Default – respects your current theme styling

Soft Cards – subtle shadows, gentle rounding, modern look

Borderless Grid – image-first, minimal chrome

Light / Dark variations – quickly align with your site’s mood

Select a preset and it will populate the detailed design fields, which you can still override as needed.

Perfect for:

• “Shop by Category” sections on your homepage
• Seasonal landing pages
• Brand hubs and collection pages


Hyvä & Luma Friendly

• No bundled Bootstrap bloat.

• Refactored templates that play nicely with:

  • Hyvä Themes

  • The default Luma stack

• Clean markup that’s easy to restyle with your existing CSS or Tailwind/Hyvä tooling

Per-Category Control

On each category:

Catalog → Categories → Jscriptz Subcats tab

You can:

• Enable/disable subcategory cards for that category.

• Choose which subcategories to show via a context-aware category tree (only descendants, nicely indented).