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

Query title block - Archive Title #29428

Open
wants to merge 3 commits into
base: trunk
from
Open

Query title block - Archive Title #29428

wants to merge 3 commits into from

Conversation

@ntsekouras
Copy link
Contributor

@ntsekouras ntsekouras commented Mar 1, 2021

Description

Part of: #22724

This PR adds Query Title block and is implemented with block variations.
It's part of #27989 which will need more decisions about handling text replacements for example in Search Title (see more info in the above PR's description).

For now it only supports Archive Title which is definitely needed and we can move towards other variations incrementally.

Notes about Archive Title

  1. Is not editable, but filterable by get_the_archive_title hook
  2. Doesn't support any preview in the editor as this is part of detecting the proper context, which is not implemented yet. You can still though select heading level, colors etc..
ntsekouras added 2 commits Feb 25, 2021
@ntsekouras ntsekouras requested a review from WordPress/gutenberg-core Mar 1, 2021
@ntsekouras ntsekouras self-assigned this Mar 1, 2021
"innerBlocks": [],
"originalContent": ""
}
{

This comment has been minimized.

@ntsekouras

ntsekouras Mar 1, 2021
Author Contributor

These changes in table-of-contents are irrelevant and are a result of regenerating the fixtures. If this PR delay to land, I'll handle it in a separate PR.

@github-actions
Copy link

@github-actions github-actions bot commented Mar 1, 2021

Size Change: +10.2 kB (+1%)

Total Size: 1.4 MB

Filename Size Change
build/a11y/index.js 1.14 kB -1 B (0%)
build/annotations/index.js 3.78 kB -11 B (0%)
build/api-fetch/index.js 3.4 kB -8 B (0%)
build/autop/index.js 2.82 kB -17 B (-1%)
build/blob/index.js 664 B -1 B (0%)
build/block-directory/index.js 8.63 kB -471 B (-5%)
build/block-directory/style-rtl.css 1 kB -6 B (-1%)
build/block-directory/style.css 1.01 kB -5 B (0%)
build/block-editor/index.js 125 kB +44 B (0%)
build/block-library/blocks/navigation/editor-rtl.css 1.34 kB +2 B (0%)
build/block-library/blocks/navigation/editor.css 1.34 kB +3 B (0%)
build/block-library/blocks/page-list/editor-rtl.css 215 B +1 B (0%)
build/block-library/blocks/page-list/editor.css 215 B +1 B (0%)
build/block-library/blocks/spacer/editor-rtl.css 317 B +15 B (+5%) 🔍
build/block-library/blocks/spacer/editor.css 317 B +15 B (+5%) 🔍
build/block-library/common-rtl.css 1.1 kB +18 B (+2%)
build/block-library/common.css 1.1 kB +20 B (+2%)
build/block-library/editor-rtl.css 9.54 kB +17 B (0%)
build/block-library/editor.css 9.53 kB +17 B (0%)
build/block-library/index.js 148 kB +151 B (0%)
build/block-library/style-rtl.css 8.86 kB +10 B (0%)
build/block-library/style.css 8.86 kB +10 B (0%)
build/block-serialization-default-parser/index.js 1.87 kB -8 B (0%)
build/blocks/index.js 48.3 kB -71 B (0%)
build/components/index.js 283 kB +10.7 kB (+4%)
build/components/style-rtl.css 15.6 kB +8 B (0%)
build/components/style.css 15.5 kB +7 B (0%)
build/compose/index.js 11.1 kB -15 B (0%)
build/core-data/index.js 16.7 kB -54 B (0%)
build/customize-widgets/index.js 3.96 kB -130 B (-3%)
build/data-controls/index.js 828 B -3 B (0%)
build/data/index.js 8.88 kB +7 B (0%)
build/date/index.js 31.8 kB -1 B (0%)
build/dom-ready/index.js 577 B +1 B (0%)
build/dom/index.js 4.94 kB -16 B (0%)
build/edit-navigation/index.js 11 kB -27 B (0%)
build/edit-post/index.js 306 kB -610 B (0%)
build/edit-site/index.js 27 kB +581 B (+2%)
build/edit-site/style-rtl.css 4.47 kB +53 B (+1%)
build/edit-site/style.css 4.46 kB +53 B (+1%)
build/edit-widgets/index.js 20.1 kB -78 B (0%)
build/editor/index.js 42.1 kB -38 B (0%)
build/element/index.js 4.61 kB -10 B (0%)
build/format-library/index.js 6.75 kB -16 B (0%)
build/hooks/index.js 2.28 kB -2 B (0%)
build/html-entities/index.js 623 B +1 B (0%)
build/i18n/index.js 4.01 kB -3 B (0%)
build/is-shallow-equal/index.js 699 B +1 B (0%)
build/keyboard-shortcuts/index.js 2.53 kB -16 B (-1%)
build/keycodes/index.js 1.95 kB -8 B (0%)
build/list-reusable-blocks/index.js 3.15 kB +2 B (0%)
build/media-utils/index.js 5.34 kB -16 B (0%)
build/notices/index.js 1.85 kB -7 B (0%)
build/nux/index.js 3.4 kB -10 B (0%)
build/plugins/index.js 2.9 kB +287 B (+11%) ⚠️
build/primitives/index.js 1.42 kB -6 B (0%)
build/react-i18n/index.js 1.45 kB +1 B (0%)
build/redux-routine/index.js 2.83 kB -3 B (0%)
build/reusable-blocks/index.js 3.78 kB -24 B (-1%)
build/rich-text/index.js 13.4 kB -69 B (-1%)
build/server-side-render/index.js 2.82 kB -1 B (0%)
build/token-list/index.js 1.27 kB +1 B (0%)
build/url/index.js 3.02 kB -1 B (0%)
build/viewport/index.js 1.86 kB +1 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/block-editor/style-rtl.css 12.1 kB 0 B
build/block-editor/style.css 12.1 kB 0 B
build/block-library/blocks/archives/editor-rtl.css 61 B 0 B
build/block-library/blocks/archives/editor.css 60 B 0 B
build/block-library/blocks/audio/editor-rtl.css 58 B 0 B
build/block-library/blocks/audio/editor.css 58 B 0 B
build/block-library/blocks/audio/style-rtl.css 103 B 0 B
build/block-library/blocks/audio/style.css 103 B 0 B
build/block-library/blocks/block/editor-rtl.css 161 B 0 B
build/block-library/blocks/block/editor.css 161 B 0 B
build/block-library/blocks/button/editor-rtl.css 475 B 0 B
build/block-library/blocks/button/editor.css 474 B 0 B
build/block-library/blocks/button/style-rtl.css 479 B 0 B
build/block-library/blocks/button/style.css 479 B 0 B
build/block-library/blocks/buttons/editor-rtl.css 315 B 0 B
build/block-library/blocks/buttons/editor.css 315 B 0 B
build/block-library/blocks/buttons/style-rtl.css 364 B 0 B
build/block-library/blocks/buttons/style.css 363 B 0 B
build/block-library/blocks/calendar/style-rtl.css 208 B 0 B
build/block-library/blocks/calendar/style.css 208 B 0 B
build/block-library/blocks/categories/editor-rtl.css 84 B 0 B
build/block-library/blocks/categories/editor.css 83 B 0 B
build/block-library/blocks/categories/style-rtl.css 79 B 0 B
build/block-library/blocks/categories/style.css 79 B 0 B
build/block-library/blocks/code/style-rtl.css 90 B 0 B
build/block-library/blocks/code/style.css 90 B 0 B
build/block-library/blocks/columns/editor-rtl.css 190 B 0 B
build/block-library/blocks/columns/editor.css 190 B 0 B
build/block-library/blocks/columns/style-rtl.css 421 B 0 B
build/block-library/blocks/columns/style.css 421 B 0 B
build/block-library/blocks/cover/editor-rtl.css 390 B 0 B
build/block-library/blocks/cover/editor.css 389 B 0 B
build/block-library/blocks/cover/style-rtl.css 1.25 kB 0 B
build/block-library/blocks/cover/style.css 1.25 kB 0 B
build/block-library/blocks/embed/editor-rtl.css 486 B 0 B
build/block-library/blocks/embed/editor.css 486 B 0 B
build/block-library/blocks/embed/style-rtl.css 396 B 0 B
build/block-library/blocks/embed/style.css 395 B 0 B
build/block-library/blocks/file/editor-rtl.css 199 B 0 B
build/block-library/blocks/file/editor.css 198 B 0 B
build/block-library/blocks/file/style-rtl.css 248 B 0 B
build/block-library/blocks/file/style.css 248 B 0 B
build/block-library/blocks/freeform/editor-rtl.css 2.45 kB 0 B
build/block-library/blocks/freeform/editor.css 2.45 kB 0 B
build/block-library/blocks/gallery/editor-rtl.css 689 B 0 B
build/block-library/blocks/gallery/editor.css 690 B 0 B
build/block-library/blocks/gallery/style-rtl.css 1.07 kB 0 B
build/block-library/blocks/gallery/style.css 1.06 kB 0 B
build/block-library/blocks/group/editor-rtl.css 318 B 0 B
build/block-library/blocks/group/editor.css 317 B 0 B
build/block-library/blocks/group/style-rtl.css 57 B 0 B
build/block-library/blocks/group/style.css 57 B 0 B
build/block-library/blocks/heading/editor-rtl.css 129 B 0 B
build/block-library/blocks/heading/editor.css 129 B 0 B
build/block-library/blocks/heading/style-rtl.css 76 B 0 B
build/block-library/blocks/heading/style.css 76 B 0 B
build/block-library/blocks/html/editor-rtl.css 281 B 0 B
build/block-library/blocks/html/editor.css 281 B 0 B
build/block-library/blocks/image/editor-rtl.css 717 B 0 B
build/block-library/blocks/image/editor.css 716 B 0 B
build/block-library/blocks/image/style-rtl.css 477 B 0 B
build/block-library/blocks/image/style.css 478 B 0 B
build/block-library/blocks/latest-comments/editor-rtl.css 159 B 0 B
build/block-library/blocks/latest-comments/editor.css 158 B 0 B
build/block-library/blocks/latest-comments/style-rtl.css 269 B 0 B
build/block-library/blocks/latest-comments/style.css 269 B 0 B
build/block-library/blocks/latest-posts/editor-rtl.css 137 B 0 B
build/block-library/blocks/latest-posts/editor.css 137 B 0 B
build/block-library/blocks/latest-posts/style-rtl.css 523 B 0 B
build/block-library/blocks/latest-posts/style.css 522 B 0 B
build/block-library/blocks/list/editor-rtl.css 65 B 0 B
build/block-library/blocks/list/editor.css 65 B 0 B
build/block-library/blocks/list/style-rtl.css 63 B 0 B
build/block-library/blocks/list/style.css 63 B 0 B
build/block-library/blocks/media-text/editor-rtl.css 191 B 0 B
build/block-library/blocks/media-text/editor.css 191 B 0 B
build/block-library/blocks/media-text/style-rtl.css 535 B 0 B
build/block-library/blocks/media-text/style.css 532 B 0 B
build/block-library/blocks/more/editor-rtl.css 434 B 0 B
build/block-library/blocks/more/editor.css 434 B 0 B
build/block-library/blocks/navigation-link/editor-rtl.css 681 B 0 B
build/block-library/blocks/navigation-link/editor.css 683 B 0 B
build/block-library/blocks/navigation-link/style-rtl.css 694 B 0 B
build/block-library/blocks/navigation-link/style.css 692 B 0 B
build/block-library/blocks/navigation/style-rtl.css 213 B 0 B
build/block-library/blocks/navigation/style.css 214 B 0 B
build/block-library/blocks/nextpage/editor-rtl.css 395 B 0 B
build/block-library/blocks/nextpage/editor.css 395 B 0 B
build/block-library/blocks/page-list/style-rtl.css 527 B 0 B
build/block-library/blocks/page-list/style.css 526 B 0 B
build/block-library/blocks/paragraph/editor-rtl.css 109 B 0 B
build/block-library/blocks/paragraph/editor.css 109 B 0 B
build/block-library/blocks/paragraph/style-rtl.css 288 B 0 B
build/block-library/blocks/paragraph/style.css 289 B 0 B
build/block-library/blocks/post-author/editor-rtl.css 209 B 0 B
build/block-library/blocks/post-author/editor.css 209 B 0 B
build/block-library/blocks/post-author/style-rtl.css 183 B 0 B
build/block-library/blocks/post-author/style.css 184 B 0 B
build/block-library/blocks/post-comments-form/style-rtl.css 250 B 0 B
build/block-library/blocks/post-comments-form/style.css 250 B 0 B
build/block-library/blocks/post-content/editor-rtl.css 139 B 0 B
build/block-library/blocks/post-content/editor.css 139 B 0 B
build/block-library/blocks/post-excerpt/editor-rtl.css 73 B 0 B
build/block-library/blocks/post-excerpt/editor.css 73 B 0 B
build/block-library/blocks/post-featured-image/editor-rtl.css 338 B 0 B
build/block-library/blocks/post-featured-image/editor.css 338 B 0 B
build/block-library/blocks/post-featured-image/style-rtl.css 100 B 0 B
build/block-library/blocks/post-featured-image/style.css 100 B 0 B
build/block-library/blocks/preformatted/style-rtl.css 63 B 0 B
build/block-library/blocks/preformatted/style.css 63 B 0 B
build/block-library/blocks/pullquote/editor-rtl.css 183 B 0 B
build/block-library/blocks/pullquote/editor.css 183 B 0 B
build/block-library/blocks/pullquote/style-rtl.css 316 B 0 B
build/block-library/blocks/pullquote/style.css 316 B 0 B
build/block-library/blocks/query-loop/editor-rtl.css 90 B 0 B
build/block-library/blocks/query-loop/editor.css 89 B 0 B
build/block-library/blocks/query-loop/style-rtl.css 315 B 0 B
build/block-library/blocks/query-loop/style.css 317 B 0 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122 B 0 B
build/block-library/blocks/query-pagination-numbers/editor.css 121 B 0 B
build/block-library/blocks/query-pagination/editor-rtl.css 270 B 0 B
build/block-library/blocks/query-pagination/editor.css 262 B 0 B
build/block-library/blocks/query-pagination/style-rtl.css 168 B 0 B
build/block-library/blocks/query-pagination/style.css 168 B 0 B
build/block-library/blocks/query/editor-rtl.css 814 B 0 B
build/block-library/blocks/query/editor.css 812 B 0 B
build/block-library/blocks/quote/editor-rtl.css 61 B 0 B
build/block-library/blocks/quote/editor.css 61 B 0 B
build/block-library/blocks/quote/style-rtl.css 169 B 0 B
build/block-library/blocks/quote/style.css 169 B 0 B
build/block-library/blocks/rss/editor-rtl.css 201 B 0 B
build/block-library/blocks/rss/editor.css 202 B 0 B
build/block-library/blocks/rss/style-rtl.css 290 B 0 B
build/block-library/blocks/rss/style.css 290 B 0 B
build/block-library/blocks/search/editor-rtl.css 165 B 0 B
build/block-library/blocks/search/editor.css 165 B 0 B
build/block-library/blocks/search/style-rtl.css 342 B 0 B
build/block-library/blocks/search/style.css 344 B 0 B
build/block-library/blocks/separator/editor-rtl.css 99 B 0 B
build/block-library/blocks/separator/editor.css 99 B 0 B
build/block-library/blocks/separator/style-rtl.css 236 B 0 B
build/block-library/blocks/separator/style.css 236 B 0 B
build/block-library/blocks/shortcode/editor-rtl.css 504 B 0 B
build/block-library/blocks/shortcode/editor.css 504 B 0 B
build/block-library/blocks/site-logo/editor-rtl.css 201 B 0 B
build/block-library/blocks/site-logo/editor.css 201 B 0 B
build/block-library/blocks/site-logo/style-rtl.css 115 B 0 B
build/block-library/blocks/site-logo/style.css 115 B 0 B
build/block-library/blocks/social-link/editor-rtl.css 164 B 0 B
build/block-library/blocks/social-link/editor.css 165 B 0 B
build/block-library/blocks/social-links/editor-rtl.css 696 B 0 B
build/block-library/blocks/social-links/editor.css 696 B 0 B
build/block-library/blocks/social-links/style-rtl.css 1.32 kB 0 B
build/block-library/blocks/social-links/style.css 1.32 kB 0 B
build/block-library/blocks/spacer/style-rtl.css 48 B 0 B
build/block-library/blocks/spacer/style.css 48 B 0 B
build/block-library/blocks/subhead/editor-rtl.css 99 B 0 B
build/block-library/blocks/subhead/editor.css 99 B 0 B
build/block-library/blocks/subhead/style-rtl.css 80 B 0 B
build/block-library/blocks/subhead/style.css 80 B 0 B
build/block-library/blocks/table/editor-rtl.css 478 B 0 B
build/block-library/blocks/table/editor.css 478 B 0 B
build/block-library/blocks/table/style-rtl.css 390 B 0 B
build/block-library/blocks/table/style.css 390 B 0 B
build/block-library/blocks/tag-cloud/editor-rtl.css 118 B 0 B
build/block-library/blocks/tag-cloud/editor.css 118 B 0 B
build/block-library/blocks/tag-cloud/style-rtl.css 94 B 0 B
build/block-library/blocks/tag-cloud/style.css 94 B 0 B
build/block-library/blocks/template-part/editor-rtl.css 557 B 0 B
build/block-library/blocks/template-part/editor.css 556 B 0 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B 0 B
build/block-library/blocks/text-columns/editor.css 95 B 0 B
build/block-library/blocks/text-columns/style-rtl.css 166 B 0 B
build/block-library/blocks/text-columns/style.css 166 B 0 B
build/block-library/blocks/verse/editor-rtl.css 62 B 0 B
build/block-library/blocks/verse/editor.css 62 B 0 B
build/block-library/blocks/verse/style-rtl.css 87 B 0 B
build/block-library/blocks/verse/style.css 87 B 0 B
build/block-library/blocks/video/editor-rtl.css 504 B 0 B
build/block-library/blocks/video/editor.css 503 B 0 B
build/block-library/blocks/video/style-rtl.css 193 B 0 B
build/block-library/blocks/video/style.css 193 B 0 B
build/block-library/theme-rtl.css 736 B 0 B
build/block-library/theme.css 736 B 0 B
build/block-serialization-spec-parser/index.js 3.06 kB 0 B
build/customize-widgets/style-rtl.css 168 B 0 B
build/customize-widgets/style.css 168 B 0 B
build/deprecated/index.js 769 B 0 B
build/edit-navigation/style-rtl.css 1.26 kB 0 B
build/edit-navigation/style.css 1.25 kB 0 B
build/edit-post/style-rtl.css 6.81 kB 0 B
build/edit-post/style.css 6.8 kB 0 B
build/edit-widgets/style-rtl.css 3.2 kB 0 B
build/edit-widgets/style.css 3.2 kB 0 B
build/editor/editor-styles-rtl.css 543 B 0 B
build/editor/editor-styles.css 545 B 0 B
build/editor/style-rtl.css 3.9 kB 0 B
build/editor/style.css 3.9 kB 0 B
build/escape-html/index.js 735 B 0 B
build/format-library/style-rtl.css 637 B 0 B
build/format-library/style.css 639 B 0 B
build/list-reusable-blocks/style-rtl.css 629 B 0 B
build/list-reusable-blocks/style.css 628 B 0 B
build/nux/style-rtl.css 731 B 0 B
build/nux/style.css 727 B 0 B
build/priority-queue/index.js 791 B 0 B
build/reusable-blocks/style-rtl.css 225 B 0 B
build/reusable-blocks/style.css 225 B 0 B
build/shortcode/index.js 1.7 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.22 kB 0 B

compressed-size-action

@ntsekouras ntsekouras requested review from kjellr and carolinan Mar 1, 2021
Base automatically changed from master to trunk Mar 1, 2021
@kjellr
Copy link
Contributor

@kjellr kjellr commented Mar 1, 2021

This seems to work well in my testing! I created an archive page template, added this block to the template, and it's showing up as expected on the front end. 👍

Editor:

Screen Shot 2021-03-01 at 2 13 09 PM

Front End:

Screen Shot 2021-03-01 at 2 13 35 PM

Co-authored-by: Carolina Nymark <[email protected]>
@carolinan
Copy link
Contributor

@carolinan carolinan commented Mar 8, 2021

I think that we need to match the title and description - I mean that if it is decided that the term/category/tag description block is not a block for the query, but stand-alone, then the title needs to be the same, and their block names should match too.

@ntsekouras
Copy link
Contributor Author

@ntsekouras ntsekouras commented Mar 8, 2021

I think that we need to match the title and description - I mean that if it is decided that the term/category/tag description block is not a block for the query, but stand-alone, then the title needs to be the same, and their block names should match too.

Query Title will have other variations with at least a Search Title. At the relevant discussion here there are opinions that a Query description wouldn't make any sense besides the terms description. If that's the case, I think it's okay to have a Query Title and a Terms Description as separate blocks, without the need to have matching names.

@carolinan
Copy link
Contributor

@carolinan carolinan commented Mar 9, 2021

Once I started testing the block I still found it confusing that I could place the block anywhere in the editor, but on the front it only displayed on archive pages.

I am struggling with how a user can understand how this block works if it is not a child block of the query, because the editor and front will not match.

Can there be a warning instead of a placeholder, on pages that are not archives? For example in the regular post editor.

@aristath
Copy link
Member

@aristath aristath commented Mar 10, 2021

Can there be a warning instead of a placeholder, on pages that are not archives? For example in the regular post editor.

Ideally, FSE blocks will only be available in the site-editor. I think I've seen a ticket for that somewhere but can't find it right now... AFAIK that is the plan and these blocks will not be available in the post-editor.

@ntsekouras
Copy link
Contributor Author

@ntsekouras ntsekouras commented Mar 10, 2021

I am struggling with how a user can understand how this block works if it is not a child block of the query, because the editor and front will not match.
Can there be a warning instead of a placeholder, on pages that are not archives? For example in the regular post editor.

I understand what you're saying but this is a more complex problem with context detection that hasn't been solved yet. So I agree with you and Ari about:

Ideally, FSE blocks will only be available in the site-editor.

but this will be handled later..

For now we can probably have a better description to indicate its behavior and I have no strong opinion on making it available only in Query block. Whatever we decide should have the same direction with the description block.

@carolinan
Copy link
Contributor

@carolinan carolinan commented Mar 10, 2021

Can there be a warning instead of a placeholder, on pages that are not archives? For example in the regular post editor.

Ideally, FSE blocks will only be available in the site-editor. I think I've seen a ticket for that somewhere but can't find it right now... AFAIK that is the plan and these blocks will not be available in the post-editor.

I think it is the opposite, but it is not decided which blocks yet:
#28744

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

4 participants