The WordPress Block Editor - Categories Block

WordPress Block Editor – Categories List Block

WordPress Block Editor - Categories Block

This tutorial is part of our series on How To Use The WordPress Block Editor (Gutenberg).

***

Categories List Block – Description

The Categories List block organizes and displays your published posts as a list of categories. Use this block to provide your site visitors with a useful way to discover your related posts.

Sample content with a Categories block.
Add a Categories List block to your content.

How To Use The Categories List Block

In this section, we’ll cover:

  • How to add a Categories List block to your content.
  • How to edit and configure your Categories List block and block settings.
  • How to remove the Categories List block from your content.

For more details on using blocks (e.g. how to move blocks around your content), see this tutorial: How To Use Blocks.

Adding A Categories List Block

To add a Categories List block to your content:

  • Either:
    • Click on the ‘Add Block’ tool in the Editing Toolbar section and select a Categories List block (in Most Used or Widgets section), or
    • Add the Categories List block in the Content Area.
  • Use the tools in the Categories List Block Editor or Block Settings section to edit your category list.

Let’s go through the above steps.

First, create a new post or page or open an existing post or page and either:

Click on the ‘Add Block’ tool and select the Categories List block…

Add Block Tool - Add Categories block
Add a Categories List block using the Add Block tool.

Or, select a Categories List block using the Inserter tool in the Content Area.

Categories block
Add a Categories List block via the Content Area using the Inserter tool.

new

WordPress now offers two types of Category blocks:

  • Categories List Block – This is the block covered in detail in this tutorial (note: the block icon has been updated.Some of the screenshots in this tutorial were created using the previous icon).
  • Categories Block – This block is discussed briefly below.
WordPress - Categories Blocks
WordPress offers different types of category blocks.

The Categories List block displays a list of categories based on your previously published posts by category. This block is useful for helping users find more of your posts grouped by topics.

WordPress Blocxk - Categories List Block
Categories List block

The Categories block, on the other hand, displays the category you have assigned to the current post.

WordPress Block - Categories Block
Categories block

The Categories block also lets you add and format a prefix and a suffix to the category.

WordPress Categories block - Add a prefix and a suffix to your category.
Add a prefix and a suffix to your category.

This can be useful for adding context when inserting a category into your post.

WordPress Categories block - prefix and suffix options.
Use the prefix and suffix options to add context to the category displayed on your post.

After adding a Categories List block, you can:

  • Edit and configure the block settings,
  • Save, publish, or update your post or page.

How To Edit A Categories List Block

To edit a Categories List block:

  • Click inside the Categories List block to select it.
  • Use the Block Editor tools to:
    • Reposition the Categories List block in your content using the Drag block tool and Move up and down arrows.
    • Change the alignment of the categories list.
    • Perform additional tasks using the More Options feature.
  • Use the Block Settings to change category settings.

Use the Block Editor to change block alignment.

Align Categories block.
Align your Categories List block.

Use Block Settings to change category settings.

Categories block settings.
Categories block settings.

Remember to update and publish your post or page to save your settings.

How To Remove A Categories List Block

To delete or remove a categories list block:

  • Click inside the Categories List block to select it.
  • Select the ‘More Options’ tool in the Block Editor.
  • Click on ‘Remove Block’.
  • The block will be removed from your post or page.
Removing a Categories block.
Removing a Categories block.

Additionally…

  • You can reposition your block using the ‘Move Up’ and ‘Move Down’ arrows or the Drag and Drop handle tool (see this tutorial if you need help with this step: How To Use Blocks).
  • You can also convert Categories List blocks into Reusable blocks.

Categories List Block Tools, Options & Settings

The Categories block includes tools, options, and settings for:

  • Categories List Block Editor
  • Categories List Block Settings

Categories List Block Editor

Categories block editor.
Categories block editor.

The Categories block editor includes tools that let you perform the following operations:

  • Change block type or style (See ‘Categories Block – Additional Info’ section below.)
  • Drag block
  • Move block up and down
  • Change alignment:
    • None – leaves the block alignment as is (Max 650 px wide).
    • Wide width – makes the block stick out on either side of regular content (Max 1000 px wide).
    • Full width – makes the block stretch over the entire width of the browser window (regular content remains within margins on either side).
    • Align left
    • Align center
    • Align right
Categories List block - Block alignment options
Block alignment options.

Categories List Block Settings

Categories block settings.
Categories list block settings.

Categories List block settings include:

  • Block description area
  • Categories Settings
    • Display as dropdown – Converts a list of categories into a single-line dropdown menu.
    • Show post counts – Displays the number of posts included under each category.
    • Show only top level categories – Displays only posts assigned to top-level categories.
    • Show empty categories – Displays categories with no posts assigned to them.
    • Show hierarchy – Display categories nested in a parent/child hierarchy. Note: This option will be disabled if you enable the “Show only top level categories” option.
Categories List block - Categories settings
Categories settings

Also, refer to the following block settings tutorials for the block’s styling elements found in the Styles tab:

Categories List block - Categories styles
Categories List block – Styles

Categories List Block – Additional Info

The Categories block can be converted into the following block types:

Transform Categories block.
Transform the Categories List block.

Installing plugins or themes on your site may also add new functionality, options, or settings to the Categories List block.

Sample content with a Categories block.
Add a list of categories to your content using the Categories List block.

Congratulations! Now you know how to use the WordPress content editor’s Categories List block.

***

Print Friendly, PDF & Email

Updated: April 18th, 2023

Terms Of Use | Privacy Policy

Scroll to Top