{"id":11286009,"date":"2019-03-07T12:52:06","date_gmt":"2019-03-07T12:52:06","guid":{"rendered":"https:\/\/wordpress.org\/support\/?post_type=helphub_article&p=11286009"},"modified":"2024-04-18T11:10:45","modified_gmt":"2024-04-18T11:10:45","slug":"categories-list-block","status":"publish","type":"helphub_article","link":"https:\/\/wordpress.org\/documentation\/article\/categories-list-block\/","title":{"rendered":"Categories List Block"},"content":{"rendered":"\n

Go to the List of Blocks<\/a><\/p>\n\n\n\n

The Categories List block<\/em> organizes your previously published posts by category. This can be handy for readers who want to find more of your posts about certain topics.<\/p>\n\n\n\n

\"The<\/a>
The Categories List block embedded in the Editor.<\/figcaption><\/figure>\n\n\n\n

The Categories List<\/em> block<\/em> can be added to a page by clicking on the Block Inserter<\/strong> button. You can find the Categories List<\/em> block<\/em> listed under the Widgets<\/em> section. <\/p>\n\n\n\n

Alternatively, you can type \/categories<\/kbd> to select the Categories List block and hit enter in a new\u00a0paragraph block<\/em>\u00a0to add one quickly.<\/p>\n\n\n\n

\"Add<\/a>
Add Categories list block with a slash command.<\/figcaption><\/figure>\n\n\n\n

Detailed instructions on adding blocks<\/a><\/p>\n\n\n\n

Block toolbar<\/h2>\n\n\n\n

Each block has its own block-specific controls that allow you to manipulate the block right in the editor. The Categories List<\/em> block<\/em> has the following options in the Block toolbar. <\/p>\n\n\n\n

\"Block
Categories list block toolbar<\/figcaption><\/figure>\n\n\n\n

Transform to<\/strong><\/p>\n\n\n\n

You can transform a Categories List<\/em> block<\/em><\/em> into a Tag Cloud, Columns, or a Group block. <\/p>\n\n\n\n

\"Transform
Transform tool inside Categories List block toolbar<\/figcaption><\/figure>\n\n\n\n

Block-moving tools<\/strong><\/p>\n\n\n\n

\"Block
Block moving tools inside Categories List block toolbar<\/figcaption><\/figure>\n\n\n\n

Use the block-moving tools to move the block up and down inside the editor. Use the six dots icon to drag and drop the Categories List<\/em> block<\/em><\/em><\/em> and reposition it anywhere on the editor. Alternatively, click on the up and down arrows to move the block up or down the editor.<\/p>\n\n\n\n

Get more information about moving a block within the editor.<\/a><\/p>\n\n\n\n

<\/p>\n\n\n\n

Change alignment<\/strong><\/p>\n\n\n\n

The change alignment<\/em> tool lets you align the Categories List<\/em> block<\/em><\/em> within the content. You can choose one of the following alignment options:<\/p>\n\n\n\n

\"Change<\/a>
Change alignment in the Categories List<\/em> block<\/figcaption><\/figure>\n\n\n\n

None<\/strong>: Leaves the block alignment as is.<\/p>\n\n\n\n

Wide width<\/strong>: Increase the width of the block beyond the content size.<\/p>\n\n\n\n

Full width<\/strong>: Extend the block to cover the full width of the screen (if supported by your site\u2019s theme).<\/p>\n\n\n\n

Align left<\/strong>: Align the block to the left of the content.<\/p>\n\n\n\n

Align center<\/strong>: Align the block to the center of the content.<\/p>\n\n\n\n

Align right<\/strong>: Align the block to the right of the content.<\/p>\n\n\n\n

\n

More options<\/strong><\/p>\n\n\n\n

These controls give you the option to copy, duplicate, and edit your block as HTML.<\/p>\n<\/div>\n\n\n\n

Read about these and other settings.<\/a><\/p>\n\n\n\n

Block settings<\/h2>\n\n\n\n

Every block has specific options in the editor sidebar in addition to the options found in the block toolbar. If you do not see the sidebar, simply click the sidebar icon.<\/em><\/p>\n\n\n\n

\"Show<\/figure>\n\n\n\n

Categories List settings<\/h3>\n\n\n\n

The Categories List settings allow you to choose whether to display the categories list as a dropdown, or the default bulleted list. You also have the choice to show\/hide the hierarchy, the top-level categories only, and the post counts.<\/p>\n\n\n\n

\"Block<\/a>
Categories List Settings in the sidebar<\/figcaption><\/figure>\n\n\n\n

Display as dropdown<\/strong> <\/p>\n\n\n\n

Choose this option to display the categories in a dropdown menu rather than as a list. This is handy if you want to save space or have a lot of categories.<\/p>\n\n\n\n

\"Categories<\/a>
Categories displayed as dropdown<\/figcaption><\/figure>\n\n\n\n

Show post counts<\/strong> <\/p>\n\n\n\n

If this option is chosen, the total number of published posts for each category will be displayed next to the category link. You can show post counts in both the list and dropdown display formats.<\/p>\n\n\n\n

\"Categories
Categories list block with post counts shown<\/figcaption><\/figure>\n\n\n\n

Show only top-level categories<\/strong> <\/p>\n\n\n\n

If you have parent and child categories (subcategories within main categories) you can choose to display only the top-level category.<\/p>\n\n\n\n

Show empty categories<\/strong> <\/p>\n\n\n\n

You have the option to show or hide empty categories in the categories list.<\/p>\n\n\n\n

Show hierarchy<\/strong> <\/p>\n\n\n\n

If you have parent and child categories (subcategories within main categories) you can choose to display the hierarchy or just leave the list without indicating which subcategories fit inside your main categories. You can show category hierarchies in both the list and dropdown display formats.<\/p>\n\n\n\n

\"Categories<\/a>
Categories list with hierarchy shown<\/figcaption><\/figure>\n\n\n\n

Typography<\/h3>\n\n\n\n

The Typography settings enable you to customize the font and text appearance of the content within the Categories List<\/em><\/em> block. The settings have various options, such as font size, font style, font family, and letter spacing.<\/p>\n\n\n\n

Get more details about changing typography settings.<\/a><\/p>\n\n\n\n

Dimensions<\/h3>\n\n\n\n

The <\/strong>Categories List<\/em><\/em><\/em> block provides dimension settings options to add padding and margin.<\/p>\n\n\n\n

For details refer to this support article: Dimension settings overview<\/a><\/p>\n\n\n\n

Advanced settings<\/h3>\n\n\n\n

The advanced tab lets you add a CSS class to your block, allowing you to write custom CSS and style the block as you see fit.<\/p>\n\n\n\n

\"The<\/a>
The advanced section lets you add a CSS class to your block.<\/figcaption><\/figure>\n\n\n\n
\n

Changelog<\/h2>\n\n\n\n
    \n
  • Updated 2023-05-23\n
      \n
    • Added typography, dimension settings info<\/li>\n\n\n\n
    • Added option to show empty categories<\/li>\n\n\n\n
    • Changed name to Categories List block and updated the screenshots<\/li>\n\n\n\n
    • Added ALT tags<\/li>\n<\/ul>\n<\/li>\n\n\n\n
    • Updated 2022-11-25\n
        \n
      • Removed redundant content<\/li>\n\n\n\n
      • Aligned imaged for mobile view<\/li>\n<\/ul>\n<\/li>\n\n\n\n
      • Updated 2022-08-04\n
          \n
        • Added screenshots and content for 6.0<\/li>\n\n\n\n
        • Added ALT tags for the images<\/li>\n<\/ul>\n<\/li>\n\n\n\n
        • Created 2019-03-07<\/li>\n<\/ul>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

          Go to the List of Blocks The Categories List block organizes your previously published posts by category. This can be handy for readers who want to find more of your posts about certain topics. The Categories List block can be added to a page by clicking on the Block Inserter button. You can find the Categories List block listed under […]<\/p>\n","protected":false},"featured_media":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","category":[80,90],"class_list":["post-11286009","helphub_article","type-helphub_article","status-publish","hentry","category-customization","category-widget-blocks"],"revision_note":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/11286009","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles"}],"about":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/types\/helphub_article"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/comments?post=11286009"}],"version-history":[{"count":5,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/11286009\/revisions"}],"predecessor-version":[{"id":16357537,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/articles\/11286009\/revisions\/16357537"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/media?parent=11286009"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.org\/documentation\/wp-json\/wp\/v2\/category?post=11286009"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}