Hardware FixRecommendedDevice not working? Your driver may be the problemCheck updates for common hardware issues.Fix DriversOctober DealsAmazon USOctober deal check: compare before you payAmazon US: current deals, useful picks and tech finds.Check DealsSlow PC?RecommendedPC slow today? Run a repair scan before it gets worseResolve common Windows issues and optimize system performance.Scan Now×
Skip to content
World desk4 min

How to Create a Custom WooCommerce Category Page Design

Create a WooCommerce category archive with the Site Editor in a block theme, or use theme controls, hooks, and child-theme overrides in a classic theme.
Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

To create a custom WooCommerce category page, first check whether your active theme is a block theme or a classic theme. In a block theme, open Appearance > Editor > Templates > WooCommerce and add a Products by Category template for all categories or one selected category. Classic themes use their own settings, WooCommerce hooks, and—when the structure must change—PHP template overrides.

Choose the workflow that matches your theme

WooCommerce category pages are archive templates, not ordinary WordPress pages. Block themes let you edit templates in the Site Editor; classic themes use PHP templates. A classic theme may support blocks in regular pages, but that does not make its WooCommerce archive templates editable in the Site Editor. Check the active theme’s available editor and template controls before you begin. WooCommerce’s category-template guide and its classic theme guidance describe the separate approaches.

As an Amazon Associate I earn from qualifying purchases.

Create a category template in a block theme

  1. In the WordPress dashboard, go to Appearance > Editor.
  2. Open Templates > WooCommerce, then choose Add Template.
  3. Select Products by Category.
  4. Choose All Categories for a shared layout, or select one category for a layout specific to that category.
  5. Start with a pattern containing a Product Collection block configured for the selected category context, or build the layout with blocks yourself.
  6. Add or rearrange the supporting blocks, adjust layout and styles, check the preview, and save.

The shared archive layout can include an archive title, term description, notices, results count, sorting controls, and the product collection. Product Filters can help shoppers narrow the collection by price, rating, attributes, stock status, category, brand, or tag. See WooCommerce’s template instructions for the category template workflow and its block guidance for archive components.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Keep the product collection tied to the category

The Product Collection block determines which products appear; its query setting matters as much as the visual layout. With the Default query, the collection follows the current archive context and allows shoppers to filter. Available sorting options include manual order or name, price, sales, and rating. A Custom query can instead show a curated selection based on chosen criteria.

For a normal category archive, keep the collection’s category context intact when changing its settings. Otherwise the design may look right while showing products from the wrong set. Use a custom query only when a curated collection is intentional. The Product Collection documentation explains default and custom query behavior.

Use a category-specific template in a block theme’s files

For code-level control, a block theme can provide WooCommerce templates as HTML files in its /templates directory. The category template filename is taxonomy-product_cat.html; if the theme does not provide it, the view can fall back to archive-product.html. A category-specific file can target a slug—for example, taxonomy-product_cat-clothing.html for a category with the slug clothing.

Site Editor changes can affect what visitors see, so account for existing editor customizations when a theme file does not appear to control the design. The WooCommerce block theming documentation covers template naming and fallback behavior.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Customize a classic theme

Classic themes use PHP templates rather than the block-theme template editor. Start with the theme’s WooCommerce settings; if they do not provide enough control, use WooCommerce hooks for changes to layout or content where possible. The developer handbook describes hooks as more robust than template overrides, which require maintenance as WooCommerce evolves.

If the page structure itself must change, copy the relevant WooCommerce template into a child theme’s matching woocommerce directory, preserve the hooks in the copied template, and declare WooCommerce support when using custom WooCommerce template overrides. A child theme also keeps your custom files separate from parent-theme updates. For CSS, use the theme or child theme rather than editing WooCommerce’s plugin stylesheet, which an update can overwrite.

Check for a theme-level woocommerce.php if an archive-product.php override seems to have no effect: WooCommerce gives woocommerce.php priority, so the archive override cannot be used while that file is present. Consult the classic theme development handbook and template override guidance before maintaining custom template files.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Do not confuse category archives with the Shop page

The Product Catalog template controls the main Shop page. Product category pages use their own archive template, even though the two views can share inner blocks. Editing a page titled “Shop” may therefore leave the rendered catalog unchanged when the Product Catalog template takes precedence. WooCommerce documents the distinction in its Product Catalog template guide.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

An older WooCommerce Customizer guide describes settings at Appearance > Customize > WooCommerce > Product Catalog for showing products, subcategories, or both on category pages. These settings govern what appears in the listing; they are not a replacement for building the full archive layout in the Site Editor. The exact controls available depend on the theme and installed versions. See the Product Catalog documentation for that older display-settings approach.

Plan the design before changing it

  • Set the scope: decide whether one shared template serves every category or a particular category needs a distinct layout.
  • Plan the introduction: decide whether to show a category title and term description above the products.
  • Choose navigation: use filters, sorting, subcategories, or a combination suited to the catalog.
  • Protect the query: keep the default archive context for a dynamic category listing, or intentionally curate products with a custom query.
  • Minimize maintenance: in a classic theme, try theme controls and hooks before taking on a PHP template override.

These are implementation choices based on WooCommerce’s template, block, and query controls; they do not establish that a particular layout performs or converts better.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Leave a Reply

Your email address will not be published. Required fields are marked *

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

More from the Wire

  1. World desk4 min
    How to Spot an AI Voice Scam Before Sending MoneyDon’t rely on how a caller sounds. Pause, call back through a known number, and verify the emergency with another trusted person before sending money.
  2. Mountain View desk4 min
    Google’s SynthID Detector: How to Check AI-Generated Images, Video and AudioGoogle’s SynthID Detector looks for an embedded watermark in supported images, video and audio. Here is what its results do—and do not—show.
  3. Redmond desk20 min
    How to create a link to File or Folder in Windows 11Windows 11 gives you several ways to point to a file or folder without moving or duplicating it. You can create a desktop shortcut,…
Recommended PC Tool
Recommended PC Tool
PC Slower Than It Used to Be?Free scan - under a minute
Outdated Drivers Are Slowing You DownFree scan - exact matches

Two free Windows tools

One Free Minute Could Fix That PC

Before you go - each of these free tools takes about a minute and tackles what quietly slows a Windows PC down.

Special offer. View Outbyte info, uninstall instructions, EULA, and Privacy Policy.