Files
dotjuice-plugin-docs/docs/dotjuice-elementor-tools/widgets/woo-taxonomy-list.md
Johan f4838865c9 Docs pass: add widget screenshots and expand the user guides
Add 21 screenshots across the Elementor Tools docs and rework the pages
around them: clearer opening lines, settings tables that state defaults,
and callouts for the parts people trip over. Also refreshes the Pro
getting-started, Custom Product Tabs and Product Filter pages, plus the
matching marketing copy.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-07-31 06:13:57 +00:00

4.6 KiB
Executable File
Raw Blame History

Woo Taxonomy List

Cascading term lists from any taxonomy — a "Shop by Category" block, or a plain list of blog categories.

Found in the Elementor panel under Dotjuice → Woo Taxonomy List.

A grouped category list on the front end Screenshot: a sidebar "Shop by Category" block showing two parent terms as headings with their child terms listed and counts in brackets.

:::note Not just for WooCommerce Despite the name, this widget works with any public taxonomy — product categories, blog categories, tags, or a custom taxonomy. It only appears in the widgets panel when WooCommerce is active, so on a site without WooCommerce it isn't available even for blog categories. Get in touch with support if you need it standalone. :::

Two display modes

Hierarchical mode (the default) lets you pick specific parent terms and shows each with its children nested beneath — a "Shop by Category" block grouping related subcategories under their parent.

Flat mode lists every term in the taxonomy in one simple list — a straightforward "browse all categories" block.

Content settings — Widget Heading

Setting What it does
Heading Text Optional title above the list.
Heading URL Makes the heading a link. Only applies when Heading Text is filled in.
Heading Tag H2H6 or a plain div, so the page keeps a sensible document outline.

Content settings — List Settings

The List Settings section with the taxonomy and parent term pickers Screenshot: the widget's List Settings section showing the Taxonomy dropdown, the Parent Terms multi-select populated with terms, and the Max Depth control.

Setting Default What it does
Taxonomy Product categories Which taxonomy to pull terms from. Every public taxonomy on your site is listed.
Show All Terms (Flat) Off Switches to flat mode.
Parent Terms Hierarchical only. Which parent term(s) to display, each with its children beneath.
Show Parent Term On Hierarchical only. Shows the parent itself as a clickable heading above its children.
Max Depth 1 level Hierarchical only. How many levels of children to show — 1, 2, 3, or all.
Hide Empty Terms On Excludes terms with nothing assigned to them.
Order By Name Name, Count, Slug or Term ID.
Order Ascending Ascending or descending.

:::tip The Parent Terms list follows the Taxonomy dropdown Change Taxonomy and the Parent Terms picker repopulates with terms from the new taxonomy. This cascade only runs inside the Elementor editor — so if you're scripting or importing widget settings, set both fields explicitly rather than expecting the cascade to fill one in. :::

Content settings — Display

Setting What it does
Show Term Count Adds the post or product count in brackets after each term.
List Icon An optional icon before each term link, given as a CSS icon class (e.g. Font Awesome).

Styling

Grouped into sections:

Section Covers
Heading Typography, colour, spacing
List Container Padding, background, border, shadow
Parent Items / Parent Link Text Hierarchical mode only — the parent row and its link text
List Items Marker style (none, disc, circle, square, numbers, letters), spacing, indentation, background, hover background
Link Text Typography, colour, hover underline
List Icon Size, colour, spacing — only relevant if you've set an icon

Setting it up

A flat list, e.g. all blog categories:

  1. Choose your Taxonomy.
  2. Turn on Show All Terms (Flat).
  3. Style as needed.

A grouped list, e.g. "Shop by Category" with subcategories:

  1. Choose your Taxonomy.
  2. Leave flat mode off and select your Parent Terms.
  3. Set Max Depth to how many levels of children you want.
  4. Style as needed.

Good to know

:::caution An incomplete configuration renders nothing on the front end If your settings don't resolve to any terms — hierarchical mode with no parent terms selected yet is the usual case — the editor shows an explanatory message, but the live site shows nothing at all. Confirm the configuration is complete before publishing. :::

  • Hide Empty Terms is on by default. A term you expect to see but which has no products assigned won't appear; switch it off if you're building the catalogue out of order.
  • Ordering applies within each level, so under a parent the children sort independently of how the parents themselves are ordered.