Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Categories List block: Add dropdown for taxonomies #65272

Merged
merged 24 commits into from
Sep 17, 2024

Conversation

ockham
Copy link
Contributor

@ockham ockham commented Sep 12, 2024

What?

Allow using the Categories List block for other taxonomies.

image

Alternative to #64805.

Why?

There's been some demand for a "Terms List" block that would render a list of existing taxonomy terms for a given taxonomy -- much like the Categories List block has so far done for categories.

Fixes #33302.
Closes #26555 (which is quite outdated by now).

How?

By adding a taxonomy attribute to the Categories List block, and a dropdown to the block inspector to set that attribute.

The principal choice here was to either use block variations -- or not. I originally filed a PR for the former case (#64805), but feedback indicated that folks preferred the latter.

What is this not?

A full-fledged "Terms Query" block, as requested by #49094.

However, there's been a few issues and PRs floating around for a while for just a "simple" Terms List block (e.g. #58033, #26555), and I recently found myself working on a project where I could've used a "Terms List" block myself. I concluded that it might make sense to add such a block after all; this doesn't preclude us from adding a more powerful (and complex) Terms Query block later.

Testing Instructions

Add the following code (e.g. to your theme's functions.php) and use the "Project Types" panel in the block inspector to create a number of "Project Type" terms and assign them to a given post.

Code
function register_taxonomies() {
	/**
	 * Taxonomy: Project Types.
	 */

	 $labels = array(
		'name'          => __( 'Project Types' ),
		'singular_name' => __( 'Project Type' ),
		'add_new_item'  => __( 'Add Project Type' ),
		'new_item_name' => __( 'New Project Type' ),
	);

	$args = array(
		'label'                 => __( 'Project Types' ),
		'labels'                => $labels,
		'public'                => true,
		'publicly_queryable'    => true,
		'hierarchical'          => false,
		'show_ui'               => true,
		'show_in_menu'          => true,
		'show_in_nav_menus'     => true,
		'query_var'             => true,
		'show_admin_column'     => false,
		'show_in_rest'          => true,
		'show_tagcloud'         => false,
		'rest_base'             => 'project_types',
		'rest_controller_class' => 'WP_REST_Terms_Controller',
		'rest_namespace'        => 'wp/v2',
		'show_in_quick_edit'    => false,
		'show_in_graphql'       => false,
		/*
		 * Set the `sort` and `args` properties so that the order of terms as
		 * assigned by the user is retained (rather than sorted alphabetically).
		 * See https://developer.wordpress.org/reference/functions/register_taxonomy/#comment-2687.
		 */
		'sort'                  => true,
		'args'                  => array( 'orderby' => 'term_order' ),
	);

	register_taxonomy( 'project_types', array( 'post' ), $args );
}

add_action( 'init', 'register_taxonomies', 0 );

Then, navigate to the Site Editor and insert the "Terms List" block into a template of your choosing, and select "Project Type" from the Taxonomy dropdown in the block inspector. Save the template, and verify on the frontend that the block does indeed render a list of project type terms.

Furthermore, make sure to test with built-in taxonomies, both hierarchical (Categories) and flat (Tags).

Finally, test the toggles in the block inspector. Specifically, change the block's appearance to a dropdown, and verify that it's rendered correctly both in the editor, and on the frontend. Also verify that selecting individual items from the dropdown on the frontend causes WordPress to navigate to the corresponding taxonomy term's archive page.

Screenshots or screencast

post-terms-with-attribute

@ockham ockham added [Type] Enhancement A suggestion for improvement. [Block] Categories Affects the Categories Block labels Sep 12, 2024
@ockham ockham self-assigned this Sep 12, 2024
@ockham ockham changed the title Categories List block: Add dropwdown for taxonomies Categories List block: Add dropdown for taxonomies Sep 12, 2024
Copy link

github-actions bot commented Sep 12, 2024

Size Change: +1.75 kB (+0.1%)

Total Size: 1.77 MB

Filename Size Change
build-module/interactivity-router/index.min.js 3 kB +201 B (+7.17%) 🔍
build-module/interactivity/debug.min.js 16.4 kB -180 B (-1.08%)
build-module/interactivity/index.min.js 13.2 kB -158 B (-1.19%)
build/a11y/index.min.js 952 B +1 B (+0.11%)
build/block-editor/index.min.js 257 kB -301 B (-0.12%)
build/block-editor/style-rtl.css 16 kB -67 B (-0.42%)
build/block-editor/style.css 16 kB -72 B (-0.45%)
build/block-library/blocks/form-input/style-rtl.css 357 B +15 B (+4.39%)
build/block-library/blocks/form-input/style.css 357 B +15 B (+4.39%)
build/block-library/blocks/gallery/editor-rtl.css 946 B -9 B (-0.94%)
build/block-library/blocks/gallery/editor.css 951 B -7 B (-0.73%)
build/block-library/editor-rtl.css 11.7 kB -10 B (-0.09%)
build/block-library/editor.css 11.7 kB -9 B (-0.08%)
build/block-library/index.min.js 219 kB +869 B (+0.4%)
build/block-library/style-rtl.css 15 kB +17 B (+0.11%)
build/block-library/style.css 15 kB +17 B (+0.11%)
build/commands/index.min.js 16.1 kB -3 B (-0.02%)
build/components/index.min.js 224 kB +32 B (+0.01%)
build/components/style-rtl.css 12.2 kB +65 B (+0.54%)
build/components/style.css 12.2 kB +67 B (+0.55%)
build/core-data/index.min.js 73.2 kB +2 B (0%)
build/customize-widgets/index.min.js 11 kB -2 B (-0.02%)
build/data/index.min.js 8.98 kB -2 B (-0.02%)
build/edit-post/index.min.js 13.1 kB +439 B (+3.47%)
build/edit-post/style-rtl.css 2.54 kB +221 B (+9.55%) ⚠️
build/edit-post/style.css 2.53 kB +223 B (+9.65%) ⚠️
build/edit-site/index.min.js 217 kB -138 B (-0.06%)
build/edit-site/posts-rtl.css 7.3 kB +1 B (+0.01%)
build/edit-site/posts.css 7.3 kB +2 B (+0.03%)
build/edit-site/style-rtl.css 12.6 kB +13 B (+0.1%)
build/edit-site/style.css 12.6 kB +13 B (+0.1%)
build/edit-widgets/index.min.js 17.7 kB -3 B (-0.02%)
build/edit-widgets/style-rtl.css 4.19 kB -11 B (-0.26%)
build/edit-widgets/style.css 4.19 kB -11 B (-0.26%)
build/editor/index.min.js 102 kB -58 B (-0.06%)
build/editor/style-rtl.css 9.33 kB +48 B (+0.52%)
build/editor/style.css 9.34 kB +48 B (+0.52%)
build/preferences/index.min.js 2.9 kB +2 B (+0.07%)
build/vendors/react-dom.min.js 41.7 kB +2 B (0%)
build-module/a11y/index.min.js 482 B +482 B (new file) 🆕
ℹ️ View Unchanged
Filename Size
build-module/block-library/file/view.min.js 447 B
build-module/block-library/image/view.min.js 1.78 kB
build-module/block-library/navigation/view.min.js 1.16 kB
build-module/block-library/query/view.min.js 743 B
build-module/block-library/search/view.min.js 616 B
build/annotations/index.min.js 2.26 kB
build/api-fetch/index.min.js 2.32 kB
build/autop/index.min.js 2.12 kB
build/blob/index.min.js 579 B
build/block-directory/index.min.js 7.11 kB
build/block-directory/style-rtl.css 1.01 kB
build/block-directory/style.css 1.01 kB
build/block-editor/content-rtl.css 4.65 kB
build/block-editor/content.css 4.64 kB
build/block-editor/default-editor-styles-rtl.css 394 B
build/block-editor/default-editor-styles.css 394 B
build/block-library/blocks/archives/editor-rtl.css 61 B
build/block-library/blocks/archives/editor.css 60 B
build/block-library/blocks/archives/style-rtl.css 90 B
build/block-library/blocks/archives/style.css 90 B
build/block-library/blocks/audio/editor-rtl.css 149 B
build/block-library/blocks/audio/editor.css 151 B
build/block-library/blocks/audio/style-rtl.css 132 B
build/block-library/blocks/audio/style.css 132 B
build/block-library/blocks/audio/theme-rtl.css 134 B
build/block-library/blocks/audio/theme.css 134 B
build/block-library/blocks/avatar/editor-rtl.css 115 B
build/block-library/blocks/avatar/editor.css 115 B
build/block-library/blocks/avatar/style-rtl.css 104 B
build/block-library/blocks/avatar/style.css 104 B
build/block-library/blocks/button/editor-rtl.css 265 B
build/block-library/blocks/button/editor.css 265 B
build/block-library/blocks/button/style-rtl.css 538 B
build/block-library/blocks/button/style.css 538 B
build/block-library/blocks/buttons/editor-rtl.css 291 B
build/block-library/blocks/buttons/editor.css 291 B
build/block-library/blocks/buttons/style-rtl.css 328 B
build/block-library/blocks/buttons/style.css 328 B
build/block-library/blocks/calendar/style-rtl.css 240 B
build/block-library/blocks/calendar/style.css 240 B
build/block-library/blocks/categories/editor-rtl.css 132 B
build/block-library/blocks/categories/editor.css 131 B
build/block-library/blocks/categories/style-rtl.css 152 B
build/block-library/blocks/categories/style.css 152 B
build/block-library/blocks/code/editor-rtl.css 53 B
build/block-library/blocks/code/editor.css 53 B
build/block-library/blocks/code/style-rtl.css 121 B
build/block-library/blocks/code/style.css 121 B
build/block-library/blocks/code/theme-rtl.css 122 B
build/block-library/blocks/code/theme.css 122 B
build/block-library/blocks/columns/editor-rtl.css 108 B
build/block-library/blocks/columns/editor.css 108 B
build/block-library/blocks/columns/style-rtl.css 420 B
build/block-library/blocks/columns/style.css 420 B
build/block-library/blocks/comment-author-avatar/editor-rtl.css 124 B
build/block-library/blocks/comment-author-avatar/editor.css 124 B
build/block-library/blocks/comment-author-name/style-rtl.css 72 B
build/block-library/blocks/comment-author-name/style.css 72 B
build/block-library/blocks/comment-content/style-rtl.css 120 B
build/block-library/blocks/comment-content/style.css 120 B
build/block-library/blocks/comment-date/style-rtl.css 65 B
build/block-library/blocks/comment-date/style.css 65 B
build/block-library/blocks/comment-edit-link/style-rtl.css 70 B
build/block-library/blocks/comment-edit-link/style.css 70 B
build/block-library/blocks/comment-reply-link/style-rtl.css 71 B
build/block-library/blocks/comment-reply-link/style.css 71 B
build/block-library/blocks/comment-template/style-rtl.css 200 B
build/block-library/blocks/comment-template/style.css 199 B
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 122 B
build/block-library/blocks/comments-pagination-numbers/editor.css 121 B
build/block-library/blocks/comments-pagination/editor-rtl.css 228 B
build/block-library/blocks/comments-pagination/editor.css 217 B
build/block-library/blocks/comments-pagination/style-rtl.css 234 B
build/block-library/blocks/comments-pagination/style.css 231 B
build/block-library/blocks/comments-title/editor-rtl.css 75 B
build/block-library/blocks/comments-title/editor.css 75 B
build/block-library/blocks/comments/editor-rtl.css 832 B
build/block-library/blocks/comments/editor.css 832 B
build/block-library/blocks/comments/style-rtl.css 632 B
build/block-library/blocks/comments/style.css 631 B
build/block-library/blocks/cover/editor-rtl.css 641 B
build/block-library/blocks/cover/editor.css 642 B
build/block-library/blocks/cover/style-rtl.css 1.62 kB
build/block-library/blocks/cover/style.css 1.6 kB
build/block-library/blocks/details/editor-rtl.css 65 B
build/block-library/blocks/details/editor.css 65 B
build/block-library/blocks/details/style-rtl.css 86 B
build/block-library/blocks/details/style.css 86 B
build/block-library/blocks/embed/editor-rtl.css 331 B
build/block-library/blocks/embed/editor.css 331 B
build/block-library/blocks/embed/style-rtl.css 419 B
build/block-library/blocks/embed/style.css 419 B
build/block-library/blocks/embed/theme-rtl.css 133 B
build/block-library/blocks/embed/theme.css 133 B
build/block-library/blocks/file/editor-rtl.css 326 B
build/block-library/blocks/file/editor.css 326 B
build/block-library/blocks/file/style-rtl.css 278 B
build/block-library/blocks/file/style.css 279 B
build/block-library/blocks/file/view.min.js 324 B
build/block-library/blocks/footnotes/style-rtl.css 198 B
build/block-library/blocks/footnotes/style.css 197 B
build/block-library/blocks/form-input/editor-rtl.css 229 B
build/block-library/blocks/form-input/editor.css 229 B
build/block-library/blocks/form-submission-notification/editor-rtl.css 344 B
build/block-library/blocks/form-submission-notification/editor.css 341 B
build/block-library/blocks/form-submit-button/style-rtl.css 69 B
build/block-library/blocks/form-submit-button/style.css 69 B
build/block-library/blocks/form/view.min.js 470 B
build/block-library/blocks/freeform/editor-rtl.css 2.6 kB
build/block-library/blocks/freeform/editor.css 2.6 kB
build/block-library/blocks/gallery/style-rtl.css 1.83 kB
build/block-library/blocks/gallery/style.css 1.82 kB
build/block-library/blocks/gallery/theme-rtl.css 108 B
build/block-library/blocks/gallery/theme.css 108 B
build/block-library/blocks/group/editor-rtl.css 333 B
build/block-library/blocks/group/editor.css 333 B
build/block-library/blocks/group/style-rtl.css 103 B
build/block-library/blocks/group/style.css 103 B
build/block-library/blocks/group/theme-rtl.css 79 B
build/block-library/blocks/group/theme.css 79 B
build/block-library/blocks/heading/style-rtl.css 188 B
build/block-library/blocks/heading/style.css 188 B
build/block-library/blocks/html/editor-rtl.css 346 B
build/block-library/blocks/html/editor.css 347 B
build/block-library/blocks/image/editor-rtl.css 785 B
build/block-library/blocks/image/editor.css 787 B
build/block-library/blocks/image/style-rtl.css 1.59 kB
build/block-library/blocks/image/style.css 1.59 kB
build/block-library/blocks/image/theme-rtl.css 137 B
build/block-library/blocks/image/theme.css 137 B
build/block-library/blocks/image/view.min.js 1.65 kB
build/block-library/blocks/latest-comments/style-rtl.css 355 B
build/block-library/blocks/latest-comments/style.css 354 B
build/block-library/blocks/latest-posts/editor-rtl.css 179 B
build/block-library/blocks/latest-posts/editor.css 179 B
build/block-library/blocks/latest-posts/style-rtl.css 509 B
build/block-library/blocks/latest-posts/style.css 510 B
build/block-library/blocks/list/style-rtl.css 107 B
build/block-library/blocks/list/style.css 107 B
build/block-library/blocks/loginout/style-rtl.css 61 B
build/block-library/blocks/loginout/style.css 61 B
build/block-library/blocks/media-text/editor-rtl.css 321 B
build/block-library/blocks/media-text/editor.css 320 B
build/block-library/blocks/media-text/style-rtl.css 558 B
build/block-library/blocks/media-text/style.css 556 B
build/block-library/blocks/more/editor-rtl.css 427 B
build/block-library/blocks/more/editor.css 427 B
build/block-library/blocks/navigation-link/editor-rtl.css 644 B
build/block-library/blocks/navigation-link/editor.css 645 B
build/block-library/blocks/navigation-link/style-rtl.css 192 B
build/block-library/blocks/navigation-link/style.css 191 B
build/block-library/blocks/navigation-submenu/editor-rtl.css 295 B
build/block-library/blocks/navigation-submenu/editor.css 294 B
build/block-library/blocks/navigation/editor-rtl.css 2.19 kB
build/block-library/blocks/navigation/editor.css 2.2 kB
build/block-library/blocks/navigation/style-rtl.css 2.25 kB
build/block-library/blocks/navigation/style.css 2.23 kB
build/block-library/blocks/navigation/view.min.js 1.03 kB
build/block-library/blocks/nextpage/editor-rtl.css 392 B
build/block-library/blocks/nextpage/editor.css 392 B
build/block-library/blocks/page-list/editor-rtl.css 378 B
build/block-library/blocks/page-list/editor.css 378 B
build/block-library/blocks/page-list/style-rtl.css 175 B
build/block-library/blocks/page-list/style.css 175 B
build/block-library/blocks/paragraph/editor-rtl.css 236 B
build/block-library/blocks/paragraph/editor.css 236 B
build/block-library/blocks/paragraph/style-rtl.css 341 B
build/block-library/blocks/paragraph/style.css 340 B
build/block-library/blocks/post-author-biography/style-rtl.css 74 B
build/block-library/blocks/post-author-biography/style.css 74 B
build/block-library/blocks/post-author-name/style-rtl.css 69 B
build/block-library/blocks/post-author-name/style.css 69 B
build/block-library/blocks/post-author/editor-rtl.css 107 B
build/block-library/blocks/post-author/editor.css 107 B
build/block-library/blocks/post-author/style-rtl.css 188 B
build/block-library/blocks/post-author/style.css 189 B
build/block-library/blocks/post-comments-form/editor-rtl.css 96 B
build/block-library/blocks/post-comments-form/editor.css 96 B
build/block-library/blocks/post-comments-form/style-rtl.css 527 B
build/block-library/blocks/post-comments-form/style.css 528 B
build/block-library/blocks/post-content/editor-rtl.css 74 B
build/block-library/blocks/post-content/editor.css 74 B
build/block-library/blocks/post-content/style-rtl.css 79 B
build/block-library/blocks/post-content/style.css 79 B
build/block-library/blocks/post-date/style-rtl.css 62 B
build/block-library/blocks/post-date/style.css 62 B
build/block-library/blocks/post-excerpt/editor-rtl.css 71 B
build/block-library/blocks/post-excerpt/editor.css 71 B
build/block-library/blocks/post-excerpt/style-rtl.css 155 B
build/block-library/blocks/post-excerpt/style.css 155 B
build/block-library/blocks/post-featured-image/editor-rtl.css 729 B
build/block-library/blocks/post-featured-image/editor.css 726 B
build/block-library/blocks/post-featured-image/style-rtl.css 347 B
build/block-library/blocks/post-featured-image/style.css 347 B
build/block-library/blocks/post-navigation-link/style-rtl.css 215 B
build/block-library/blocks/post-navigation-link/style.css 214 B
build/block-library/blocks/post-template/editor-rtl.css 99 B
build/block-library/blocks/post-template/editor.css 98 B
build/block-library/blocks/post-template/style-rtl.css 399 B
build/block-library/blocks/post-template/style.css 398 B
build/block-library/blocks/post-terms/style-rtl.css 96 B
build/block-library/blocks/post-terms/style.css 96 B
build/block-library/blocks/post-time-to-read/style-rtl.css 70 B
build/block-library/blocks/post-time-to-read/style.css 70 B
build/block-library/blocks/post-title/style-rtl.css 226 B
build/block-library/blocks/post-title/style.css 226 B
build/block-library/blocks/preformatted/style-rtl.css 125 B
build/block-library/blocks/preformatted/style.css 125 B
build/block-library/blocks/pullquote/editor-rtl.css 134 B
build/block-library/blocks/pullquote/editor.css 134 B
build/block-library/blocks/pullquote/style-rtl.css 342 B
build/block-library/blocks/pullquote/style.css 342 B
build/block-library/blocks/pullquote/theme-rtl.css 167 B
build/block-library/blocks/pullquote/theme.css 167 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 121 B
build/block-library/blocks/query-pagination-numbers/editor.css 118 B
build/block-library/blocks/query-pagination/editor-rtl.css 154 B
build/block-library/blocks/query-pagination/editor.css 154 B
build/block-library/blocks/query-pagination/style-rtl.css 237 B
build/block-library/blocks/query-pagination/style.css 237 B
build/block-library/blocks/query-title/style-rtl.css 64 B
build/block-library/blocks/query-title/style.css 64 B
build/block-library/blocks/query/editor-rtl.css 452 B
build/block-library/blocks/query/editor.css 451 B
build/block-library/blocks/query/view.min.js 958 B
build/block-library/blocks/quote/style-rtl.css 238 B
build/block-library/blocks/quote/style.css 238 B
build/block-library/blocks/quote/theme-rtl.css 233 B
build/block-library/blocks/quote/theme.css 236 B
build/block-library/blocks/read-more/style-rtl.css 138 B
build/block-library/blocks/read-more/style.css 138 B
build/block-library/blocks/rss/editor-rtl.css 101 B
build/block-library/blocks/rss/editor.css 101 B
build/block-library/blocks/rss/style-rtl.css 288 B
build/block-library/blocks/rss/style.css 287 B
build/block-library/blocks/search/editor-rtl.css 199 B
build/block-library/blocks/search/editor.css 199 B
build/block-library/blocks/search/style-rtl.css 672 B
build/block-library/blocks/search/style.css 671 B
build/block-library/blocks/search/theme-rtl.css 113 B
build/block-library/blocks/search/theme.css 113 B
build/block-library/blocks/search/view.min.js 475 B
build/block-library/blocks/separator/editor-rtl.css 100 B
build/block-library/blocks/separator/editor.css 100 B
build/block-library/blocks/separator/style-rtl.css 248 B
build/block-library/blocks/separator/style.css 248 B
build/block-library/blocks/separator/theme-rtl.css 195 B
build/block-library/blocks/separator/theme.css 195 B
build/block-library/blocks/shortcode/editor-rtl.css 286 B
build/block-library/blocks/shortcode/editor.css 286 B
build/block-library/blocks/site-logo/editor-rtl.css 806 B
build/block-library/blocks/site-logo/editor.css 803 B
build/block-library/blocks/site-logo/style-rtl.css 218 B
build/block-library/blocks/site-logo/style.css 218 B
build/block-library/blocks/site-tagline/editor-rtl.css 87 B
build/block-library/blocks/site-tagline/editor.css 87 B
build/block-library/blocks/site-tagline/style-rtl.css 65 B
build/block-library/blocks/site-tagline/style.css 65 B
build/block-library/blocks/site-title/editor-rtl.css 85 B
build/block-library/blocks/site-title/editor.css 85 B
build/block-library/blocks/site-title/style-rtl.css 206 B
build/block-library/blocks/site-title/style.css 206 B
build/block-library/blocks/social-link/editor-rtl.css 338 B
build/block-library/blocks/social-link/editor.css 338 B
build/block-library/blocks/social-links/editor-rtl.css 757 B
build/block-library/blocks/social-links/editor.css 756 B
build/block-library/blocks/social-links/style-rtl.css 1.51 kB
build/block-library/blocks/social-links/style.css 1.5 kB
build/block-library/blocks/spacer/editor-rtl.css 346 B
build/block-library/blocks/spacer/editor.css 346 B
build/block-library/blocks/spacer/style-rtl.css 48 B
build/block-library/blocks/spacer/style.css 48 B
build/block-library/blocks/table-of-contents/style-rtl.css 83 B
build/block-library/blocks/table-of-contents/style.css 83 B
build/block-library/blocks/table/editor-rtl.css 394 B
build/block-library/blocks/table/editor.css 394 B
build/block-library/blocks/table/style-rtl.css 640 B
build/block-library/blocks/table/style.css 639 B
build/block-library/blocks/table/theme-rtl.css 152 B
build/block-library/blocks/table/theme.css 152 B
build/block-library/blocks/tag-cloud/editor-rtl.css 144 B
build/block-library/blocks/tag-cloud/editor.css 144 B
build/block-library/blocks/tag-cloud/style-rtl.css 266 B
build/block-library/blocks/tag-cloud/style.css 265 B
build/block-library/blocks/template-part/editor-rtl.css 368 B
build/block-library/blocks/template-part/editor.css 368 B
build/block-library/blocks/template-part/theme-rtl.css 113 B
build/block-library/blocks/template-part/theme.css 113 B
build/block-library/blocks/term-description/style-rtl.css 126 B
build/block-library/blocks/term-description/style.css 126 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B
build/block-library/blocks/text-columns/editor.css 95 B
build/block-library/blocks/text-columns/style-rtl.css 165 B
build/block-library/blocks/text-columns/style.css 165 B
build/block-library/blocks/verse/style-rtl.css 98 B
build/block-library/blocks/verse/style.css 98 B
build/block-library/blocks/video/editor-rtl.css 396 B
build/block-library/blocks/video/editor.css 397 B
build/block-library/blocks/video/style-rtl.css 192 B
build/block-library/blocks/video/style.css 192 B
build/block-library/blocks/video/theme-rtl.css 134 B
build/block-library/blocks/video/theme.css 134 B
build/block-library/classic-rtl.css 179 B
build/block-library/classic.css 179 B
build/block-library/common-rtl.css 1.1 kB
build/block-library/common.css 1.1 kB
build/block-library/editor-elements-rtl.css 75 B
build/block-library/editor-elements.css 75 B
build/block-library/elements-rtl.css 54 B
build/block-library/elements.css 54 B
build/block-library/reset-rtl.css 472 B
build/block-library/reset.css 472 B
build/block-library/theme-rtl.css 708 B
build/block-library/theme.css 712 B
build/block-serialization-default-parser/index.min.js 1.12 kB
build/block-serialization-spec-parser/index.min.js 2.87 kB
build/blocks/index.min.js 52.3 kB
build/commands/style-rtl.css 955 B
build/commands/style.css 952 B
build/compose/index.min.js 12.7 kB
build/core-commands/index.min.js 2.82 kB
build/customize-widgets/style-rtl.css 1.35 kB
build/customize-widgets/style.css 1.35 kB
build/data-controls/index.min.js 641 B
build/date/index.min.js 18 kB
build/deprecated/index.min.js 458 B
build/dom-ready/index.min.js 325 B
build/dom/index.min.js 4.66 kB
build/edit-post/classic-rtl.css 578 B
build/edit-post/classic.css 580 B
build/element/index.min.js 4.83 kB
build/escape-html/index.min.js 537 B
build/format-library/index.min.js 8.11 kB
build/format-library/style-rtl.css 476 B
build/format-library/style.css 476 B
build/hooks/index.min.js 1.54 kB
build/html-entities/index.min.js 445 B
build/i18n/index.min.js 3.58 kB
build/is-shallow-equal/index.min.js 526 B
build/keyboard-shortcuts/index.min.js 1.31 kB
build/keycodes/index.min.js 1.46 kB
build/list-reusable-blocks/index.min.js 2.18 kB
build/list-reusable-blocks/style-rtl.css 846 B
build/list-reusable-blocks/style.css 846 B
build/media-utils/index.min.js 3.2 kB
build/notices/index.min.js 946 B
build/nux/index.min.js 1.61 kB
build/nux/style-rtl.css 749 B
build/nux/style.css 745 B
build/patterns/index.min.js 7.34 kB
build/patterns/style-rtl.css 687 B
build/patterns/style.css 685 B
build/plugins/index.min.js 1.81 kB
build/preferences-persistence/index.min.js 2.06 kB
build/preferences/style-rtl.css 554 B
build/preferences/style.css 554 B
build/primitives/index.min.js 829 B
build/priority-queue/index.min.js 1.54 kB
build/private-apis/index.min.js 1.01 kB
build/react-i18n/index.min.js 630 B
build/react-refresh-entry/index.min.js 9.47 kB
build/react-refresh-runtime/index.min.js 6.76 kB
build/redux-routine/index.min.js 2.69 kB
build/reusable-blocks/index.min.js 2.55 kB
build/reusable-blocks/style-rtl.css 256 B
build/reusable-blocks/style.css 256 B
build/rich-text/index.min.js 10.1 kB
build/router/index.min.js 1.96 kB
build/server-side-render/index.min.js 1.94 kB
build/shortcode/index.min.js 1.4 kB
build/style-engine/index.min.js 2.04 kB
build/token-list/index.min.js 581 B
build/url/index.min.js 3.9 kB
build/vendors/react-jsx-runtime.min.js 560 B
build/vendors/react.min.js 4.02 kB
build/viewport/index.min.js 965 B
build/warning/index.min.js 250 B
build/widgets/index.min.js 7.19 kB
build/widgets/style-rtl.css 1.16 kB
build/widgets/style.css 1.16 kB
build/wordcount/index.min.js 1.03 kB

compressed-size-action

@ockham ockham marked this pull request as ready for review September 12, 2024 11:50
@gziolo
Copy link
Member

gziolo commented Sep 17, 2024

This is what I see.

When I type categories then I see now a different block first: core/post-terms when in the product editor. I assume it's expected and I saw recommendation to merge it together with core/categories while offering another display mode:

Screenshot 2024-09-17 at 15 01 00

Do we need to apply any changes to the fronted when no terms are found. There is different handling for core/post-terms that renders nothing on the frontend. core/categories always shows "No categories` on the frontend no matter which type is selected:

Screenshot 2024-09-17 at 15 04 18 Screenshot 2024-09-17 at 15 04 22

@@ -92,8 +102,8 @@ function build_dropdown_script_block_core_categories( $dropdown_id ) {
( function() {
var dropdown = document.getElementById( '<?php echo esc_js( $dropdown_id ); ?>' );
function onCatChange() {
if ( dropdown.options[ dropdown.selectedIndex ].value > 0 ) {
location.href = "<?php echo esc_url( home_url() ); ?>/?cat=" + dropdown.options[ dropdown.selectedIndex ].value;
if ( dropdown.options[ dropdown.selectedIndex ].value !== -1 ) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is an opportunity to refactor this block to use Interactivity API. @DAreRodz and @michalczaplinski, was it on the radar?

Copy link
Member

@gziolo gziolo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks good to me and addresses long-standing issues. I left some minor feedback about the fallback message presented on the frontend when no terms are available for the specific type. Should there be a customized message printed instead of "No categories". The next step would be to digest feedback from #64805 and see how it can be further improved to remove the ambiguity between core/categories and core/post-terms.

@ockham
Copy link
Contributor Author

ockham commented Sep 17, 2024

This is what I see.

When I type categories then I see now a different block first: core/post-terms when in the product editor. I assume it's expected and I saw recommendation to merge it together with core/categories while offering another display mode:

Screenshot 2024-09-17 at 15 01 00

Ah yeah, that's a bit unfortunate 😕 I hope that's not going to pose a UX issue, but that's something we can maybe get some feedback on during the next couple of weeks and fix accordingly.

I think the suggestion was to merge the Tag cloud block (core/tag-cloud) into core/categories, as the former can be thought of a display mode of the latter. OTOH, I'm not sure that core/post-terms should be merged into core/categories, as they're conceptually different: core/categories is for showing all existing categories (or terms of a given taxonomy), whereas core/post-terms is for showing the current post's terms (i.e. it's contextual).

Do we need to apply any changes to the fronted when no terms are found. There is different handling for core/post-terms that renders nothing on the frontend. core/categories always shows "No categories` on the frontend no matter which type is selected:

Screenshot 2024-09-17 at 15 04 18 Screenshot 2024-09-17 at 15 04 22

Ah, good spot! Under the hood, we're using wp_list_categories() to render the frontend. I was assuming that it would pick up the no_terms label defined via register_taxonomy(), but that doesn't seem to be the case; instead, it has its own show_option_none argument, which defaults to No categories, so we'll have to set that accordingly.

We should also change the message in the editor, as it's kind of misleading (and... wrong? 😅 )

@ockham ockham merged commit 7f9c340 into trunk Sep 17, 2024
61 checks passed
@ockham ockham deleted the add/categories-list-block-taxonomy-dropdown branch September 17, 2024 20:38
@github-actions github-actions bot added this to the Gutenberg 19.3 milestone Sep 17, 2024
@ockham
Copy link
Contributor Author

ockham commented Sep 18, 2024

Looping in some design and product folks (👋 @jasmussen and @annezazu) for their feedback on the following discovery that @gziolo made:

One drawback is that users won't see Categories in the inserters when typing categories term. The icon remains the same, so maybe that isn't that much of an issue, as with the keywords, it will remain discoverable. Although, we should follow the feedback closely during beta and RC phase of the release.

Screenshot 2024-09-17 at 15 01 00

Note that the "Categories" block seen in the inserter in the above screenshot is core/post-terms (used to display the terms associated with a given post) and thus unrelated to the "Terms List" block (used to show all existing terms for a given taxonomy; called "Categories List" prior to this PR, and still named core/categories internally).

There are two known approaches to mitigate this problem, but they each have their own drawbacks (discussed in the respective PRs)

  1. Add a block variation for each taxonomy: Categories List block: Add variations for taxonomies #64805. (Currently closed, but can be easily reopened).
  2. Add one block variation for Categories, and another for all other cases. This was suggested and discussed in this thread, and lead to the creation of Terms List block: Add Categories-specific variation #65434.

$show_label = empty( $attributes['showLabel'] ) ? ' screen-reader-text' : '';
$default_label = $taxonomy->label;
$label_text = ! empty( $attributes['label'] ) ? $attributes['label'] : $default_label;
$wrapper_markup = '<div %1$s><label class="wp-block-categories__label' . $show_label . '" for="' . esc_attr( $id ) . '">' . $label_text . '</label>%2$s</div>';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

See comment from @peterwilsoncc WordPress/wordpress-develop#7226 (comment)

Escaping label text

It was a preexisting issue, though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Categories Affects the Categories Block [Type] Enhancement A suggestion for improvement.
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Creating a universal "Terms" or "Taxonomy Terms" block to replace the "Categories" block
4 participants