-
Notifications
You must be signed in to change notification settings - Fork 4.1k
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
Improving the algorithm for detecting the "Section Root" #65400
Comments
/cc @WordPress/block-themers is also a good group to ping here for help, I will gather some examples myself |
https://wordpress.org/themes/pierian/ Is a clear example of a multi-column layout Those are ones I've worked with recently, I'm sure there are many more |
Looking at Pierian, I can't see any way that we could detect that this center column should be treated as the "main content". If indeed that is what folks would expect. I think this is an example of a Theme that needs to update to meet new requirements. What do you think? |
I was looking at it, and Pierian has the main tag on the query loop, and it probably should be moved to the parent group, I tested zoom out and it works, but the separator looks so strange with it! |
The worst part seems to me when we find the section root to be the top most element encompassing the whole content. The problem is not that the mode is not useful there but the UX is so confusing! There is only one thing to select and that is the whole thing :D |
I've noticed that some Automattic themes have the main tag assigned to the query loop because that was the default that the starter theme in Create Block Theme was doing. We have patched that so it doesn't happen in the future. A good bunch of themes that right now might not be working correctly may be fixed if they implement the main tag semantically, and I think we should assume that themes are going to be doing just that (but not more):
In a case like Pierian, the fact that we had used the main tag on the query loop instead of a wrapper was unfortunate, but it was not wrong semantically. Should we disallow changing the element for that specific block? In any case, a layout with multiple columns, should always have the main tag be inside the column with the actual content, and that's the assumption we need to work with. I don't know if the algorithm that detects the Section root needs to be smarter, but maybe we need to detect when themes are not doing it correctly and possibly disable zoom out. We also need to accept that |
That's not correct, the |
What you're probably seeing is that if the algorithm doesn't find the " So we could change the algorithm so it considers any block type that supports the tagName and is not a "content" block. That said, we don't really want Query to be the root because, due to it being a loop, it's ill suited. That's on the Theme to fix IMHO. I'm thinking if we open it up beyond Currently I think `tagName is implemented on a case by case basis, so we'd need to raise that up to a blockSupports feature. |
One of the problems related to this is that the editors do not warn if there is no main, or if there is more than one main. |
Yes big + 1 this would solve some other issues that theme developers run into unrelated to zoom out. |
Recent efforts around Zoom Out and "Content Only" Select Mode have put more focus on the concept of the "Section Root".
The "Section Root" is loosely defined as the block which represents the "main content" of the post/page/template you are working on. It is the parent of all the "sections" of the post.
The current algorithm used to detect this is:
gutenberg/packages/editor/src/components/provider/use-block-editor-settings.js
Lines 149 to 160 in 524516d
It considers:
core/post-content
if it's a page<main>
tag for anything elseAs not all Themes/Sites will use a standard setup (arrange of blocks, usage of tags...etc) we should try and make small improvements that capture some of the most common cases.
We can not (and should not) try to capture every possible use case, because that will be impossible.
The features that make use of the "section root" are:
Todo
We need some concrete examples of edge cases around detecting the “section root” in the Editor.
For example some folks mentioned some Themes are throwing a wrapping div around things or not using
<main>
…etc. We need to gather some specifics.Pinging @WordPress/gutenberg-design
Examples
[Please list examples below]
The text was updated successfully, but these errors were encountered: