Full Site Editing Go/No Go | April 14, 2021

TL;DR

The GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party shipped v10.4 yesterday, April 14th, and Matías hosted the go/no go demo to review the current state of Full Site Editing and determine what, if anything, should be included in WordPress 5.8 (July 2021), as described in my earlier post.

The demo lasted close to 1.5 hours; it’s impressive to see how far Gutenberg has come. It was evident in the demo how powerful Full Site Editing can be. There is plenty to iterate upon and refine, but from a high level perspective all participants felt this was a “go” for WP5.8. Listed below are the primary areas to focus our collaborative efforts on, as well as a full list of issues/questions raised in the demo. With the cadence of Gutenberg updates there should be three major releases of Gutenberg (10.7) before the feature freeze date for WP5.8 betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process..

The changes that Phase 2 bring to WordPress are substantial, so to avoid overwhelming users the Global Styles interface and Site Editor (managing all templates) will ship post-WP5.8. This also gives more time for more theme authors, plugin developers, agencies, designers, site builders, and the like to explore and provide feedback.

WP5.8 Go ✅

  • Improvements from Gutenberg 9.9+.
  • Introduce new blocks (Query, Site Logo, Navigation, etc).
  • theme.json mechanism.
  • Template Editor for Pages/Blank Template.
  • Widgets Screen & BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. widgets in CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings..
  • Design tools: Duotone, Layout controls, padding, etc.

Not all of the above are currently ready but there’s some level of confidence that they can be by the time of 5.8.

Who Attended

  • Matt Mullenweg – Project Lead (advocating for the vision/mission of WordPress, and aggregate body of users)
  • Matías Ventura – Gutenberg project lead (host of the demo)
  • Helen Hou-Sandí – Lead developer (advocating for CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., and extender community)
  • Josepha Haden Chomphosy – Executive Director (advocating for the community of WordPress, and aggregate body of users)
  • Héctor Prieto – Technical Project Manager (following up on technical action items)
  • Chloé Bringmann – Assisting with administrative and operational logistics

Reflections and Action Items

Listed below are synthesized suggestions and comments from the conversation.

Pattern Directory

  • While the directory is not ready yet, iterations will continue. More available patterns will be necessary, if it is to live up to its potential.

Query Block

  • Perhaps rename Query along the lines of, “Block List.”
  • Define the “query” of query block, and refine nomenclature for users.
  • When selecting a pattern, it’s not clear that what you see is an example and that you still need to select which pattern you want. Iterate on UIUI User interface.
  • Multi-entity saving flow is not clear, as when you don’t save some entities’ changes nothing tells you what happened, and unselected changes aren’t actually discarded, just not saved in the background.
  • Iterate on the best placement for block names.
  • The “inherit query” text is not clear, both from a technical standpoint and a jargon standpoint. We need to aim for the right type of verbose so that it’s clear and descriptive.
  • 🚩 This is potentially too powerful for users—you can edit everything from the blocks in this block. Flag was seconded.

theme. jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.

  • When options aren’t available in the UI because they have been disabled by the theme, make it clear that the options are turned off.
  • theme.json should allow a primary block to declare the styles for any nested blocks (like a search block within the nav block).

Inserter

  • The slide-in inserter makes the canvas smaller, so when adding full-page patterns they don’t look the same as in the preview until the inserter is closed again. Add the possibility for the inserter to show the patterns in the canvas in a zoomed-view rather than in a responsive view.

Navigation

  • We need more user-testing of both the Navigation Block and the Navigation Editor.
  • Move most of the block popups to the toolbar like when cropping images in the Image Block. E.g., links are not visible until you edit them.

Other

Next Steps

With this outline for the WP5.8 scope, look for a plan to prioritize and address these issues in the coming days.

Recording

April 14, 2021 Recording

Thank you to @cbringmann, @matveb, and @priethor for their work on getting this content processed and ready to ship.

Transcript

April 14 2021 FSE Demo

Wed, 4/14 1:06PM • 1:25:58

SPEAKERS

Matías Ventura, Helen Hou-Sandí, Chloé Bringmann, Josepha Haden Chomphosy, Matt Mullenweg

Matías Ventura  00:05

Cool. So I think the first thing we should do is sort of recap quickly what we’re talking about with sort of what encompasses phase two; Customization. And what I have here is sort of the major areas that we have been working on for the past couple of years.

Matías Ventura  00:26

I broke it down between, among patterns and the site editing projects. There are many there, and I’ll go through each one, Design Tools, and the Widgets and Navigation Editor. So there’s like sort of four major areas that encompass phase two.

Matías Ventura  00:50

The idea was mainly to focus on the site editing, but I think it’s good to touch upon all the related pieces so that we know many of these things are already in place, like patterns, for the most part, are in place in core for a while. But there are still a few things coming up in patterns that I think are worth highlighting.

Matt Mullenweg  01:10

Do we know when the directory’s going to be fully integrated?

Matías Ventura  01:14

For the patterns directory, I have a few things to show there; I don’t know how well integrated it’s going to be because the initial milestone is going to be that you can sort of copy and paste patterns from the directory. Now, like, One-Click Install and stuff, which I think is really when it’s going to be unlocked. But it’s coming along as we have them, let me see. 

Matías Ventura  01:43

There is already in the, so this is the wordpress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/ site, that we can have patterns there even with these, like funny-looking preview stuff. The initial scope for these will be to copy a button and paste it into your site, which is pretty nice. But I think there’s a bit more than that we can still do there.

Josepha Haden Chomphosy  02:07

And I think that there also are some design iterations happening in there, especially as it relates to making it clear when you have a pattern versus an individual block, etc.; I think that we’ve got some iterations on that.

Matías Ventura  02:24

Yeah, and the main thing for the Pattern Directory is going to be having more patterns as well, like having a good collection of well-curated patterns. I think that’s going to be there. So in a sense, I think it’s important to get them. Even this initial release was just a copy and paste, just so that we can start getting the community to contribute to them and so on.

Matías Ventura  02:49

Okay, so for the site editing thing, there are like three subsets in the site editing. One is the template editor, the other is what we have been calling Global Styles, and the other one is just a ton more blocks. So those are the three main ingredients of the site editing scope.

Matías Ventura  03:11

Any questions on this breakdown? Just let me know.

Matías Ventura  03:19

The other one is design tools. The design tools are essentially what powers all the things we can do with patterns, all the things we can do. It just comes down to what customization tools each block has. So this has been in development ever since phase one, but some important ones are coming now. Especially how it connects with themes, which has been one of the biggest struggles to ensure that themes don’t need to do a ton to support the editor, that’s one of the major goals. Because as long as themes need to do too much work, that’s always going to end up being like a fragmented experience or not, not a good enough experience. By theme support, I mainly mean themes being able to support things like alignments, padding tools, like all the things that the Block Editor offers, and ensuring that it looks the same in the editor on the front.

Matías Ventura  04:20

And the last one is the widgets and navigation editor. Those are mostly geared towards the existing themes so that themes can use blocks in more places than just the post content without having to change anything. Essentially, that’s the aim of that work.

Matías Ventura  04:43

So that covers sort of what it encompasses phase two from my perspective. And I want to go now into why I think all the stuff is ready for 5.8, and we can discuss each one a bit more fine-grain.

Matías Ventura  05:02

So from the things that I think are mostly ready for 5.8, I think many of the blocks are ready. Some of the important ones are the query block, which is essentially the post list so that you can display posts, or any post type, essentially. 

Matías Ventura  05:23

A ton of other theme blocks for site title, site logo is coming through there. I think we have around 30 blocks or so that have not been released. The challenge there has been that, to have a good place to use these blocks, we needed to go beyond the content. Otherwise, it doesn’t make a lot of sense to have the Site Title in your blogblog (versus network, site) post. That’s been a challenge, sort of like, we have been keeping a lot of these blocks that I think are useful now. Especially query, you can do a lot of cool things on a page. Especially all these like blank canvas stuff, you can do a lot of cool stuff. So I think the blocks would be good to target them for this release. And I can go one by one, first with the query one, because query is interesting. One interesting thing about the query is that it makes use of patterns a lot. 

Matías Ventura  06:29

So we have this sort of setup stage when a block is connected to patterns. And this is useful for the query because the query block is a very sort of developer-oriented block; you don’t want users to be building a query or anything like that.

Matías Ventura  06:48

So the patterns that we have built there, I think, can really fit these blocks. So this is a sort of a placeholder station. You can just browse the different patterns and that you have for what queries can be. They are all like, again, drawing from your actual real posts that you have. So if the posts have featured images, and so on.

Matías Ventura  07:14

Once you choose a pattern, sort of you insert the query with that pattern, and you can just interact with it.

Matías Ventura  07:22

So I think this block is again, like I’m here, and I’m just using it on a page. So I think this is one that we should target for 5.8. There are a few still rough edges, particularly on the design side to sort out. And we need a few, probably a few more refined patterns.

Matt Mullenweg  07:47

Can you do that, again? It happened so fast, that I kind of missed it. 

Matías Ventura  07:51

Yes.

Matías Ventura  07:58

So here, I’m inserting the block query. The initial setup is sort of a carousel thing where you can slide between the different patterns. 

Matt Mullenweg  08:09

Where do we tell people what query is, or what it means?

Matías Ventura  08:13

Yeah, so that’s the other thing. I think we should probably not call it query for users. Users will be able to find it in; I would probably call it block list or something like that. And, they would find all this through all of the buttons, probably there. 

Matt Mullenweg  08:34

The name of this top one would be query standard, if I was just looking at the Add-On list?

Matías Ventura  08:40

The pattern right now is query, because it’s attached to the block, but it doesn’t have to be. 

Matt Mullenweg  08:46

But if we were looking at not attach the block, it would be like Query Standard, or it could be another name entirely?

Matías Ventura  08:52

Yep. Yep. And it was also like there was a play to the “all loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop.” thing. But that’s more of an inside joke, in a way. The idea was to make variations of this block and have it like, post list, like WooCommerce, could have one about products. It’s all powered by the same query blocks underneath. But the way that the user would find them, discover them, and insert them; should be more, like, something more tangible.

Matías Ventura  09:31

So. Let’s see, where was I with the pattern stuff? 

Matt Mullenweg  09:36

Right now you’re going through patterns? 

Matías Ventura  09:39

Yes. 

Matt Mullenweg  09:40

Okay, that wasn’t clear.

Matías Ventura  09:43

Yes, so I’ll do it again.

Matías Ventura  09:45

because it’s

Matt Mullenweg  09:57

Sorry, now you’re in like a pattern browser?

Matías Ventura  10:00

Yes, and this is something that is going to be available for all blocks. So all blocks will be able to show when you insert a block. If it’s too complex, you can say I just want to show patterns related to this block.

Matt Mullenweg  10:14

And the name is underneath right now? Is that why we can’t see it? The name of this pattern? 

Matías Ventura  10:18

The name of the pattern? Oh, it shows us in this mode – in the grid mode, I think. No, it doesn’t. It’s not showing the names here, because the design doesn’t show them.

Matt Mullenweg  10:30

But, if we show the names in one place, let’s try to show them everywhere. And in a consistent way, whether that’s above or below. I thought from the icon; it was going to be below. But I don’t know why. 

Matías Ventura  10:41

Also, there’s one confusion here; it’s not clear that this is not the content. You’re in this placeholder state. It might actually be better to have it in more of a modal or something where you know that you’re not in your page content. I still need to click this choose button here to actually apply it. 

Matt Mullenweg  11:03

What happens when you click into the rest of it?

Matías Ventura  11:07

In the actual theme? Nothing.

Matías Ventura  11:14

So, let’s pick one and see what we can do. So, one of the advantages of starting with patterns but still having access to all the blocks is that I can, for example, add the Feature Image block here; I will add it to all the instances.

Matt Mullenweg  11:40

So, it propagated. 

Matías Ventura  11:42

Yeah. 

Josepha Haden Chomphosy  11:42

Beautiful. 

Matt Mullenweg  11:43

Wow, this is really freaky.

Josepha Haden Chomphosy  11:47

I was like, “Don’t do it! Don’t change it right in the Query block, you’re gonna mess it up.” 

Matt Mullenweg  11:54

That’s why I kept missing what you did when you were entering the title. 

Matías Ventura  11:57

Yes, yeah. Let me make it smaller, because even if you do, any changes you make, like say; I don’t know, I want to like swap the columns, it will swap them all at once. 

Matt Mullenweg  12:13

That looked like… Could you edit the text there? Like what happens when you try to use the cursor? 

Matías Ventura  12:18

In this one, it’s the Date block. So, you can actually change the date of the post. You can change the format of the date. It’s not like if you type, it doesn’t do anything. If you change the title, it can allow you to change the title of the post too.

Matías Ventura  12:39

Let me…. This a bit better.

Matt Mullenweg  12:44

Does it tell you’re doing that, or it just does it kind of behind the scenes? 

Matías Ventura  12:48

It tells you. I’ll make some changes and show you I wanted to…

Matías Ventura  12:58

So if I change this title and go to this published theme, it’s showing me all the things I modify. So, I modify this post. So it’s showing me, like the other post, this 773 series because it’s a draft, but I could check this so that I don’t commit the change to the post. 

Matías Ventura  13:24

So it would never,

Matt Mullenweg  13:26

I think it needs to point to the other thing when you do that.

Matías Ventura  13:30

Sorry, what?

Matt Mullenweg  13:32

I think it has to. It has to be a bit more specific or point to what’s happening. When you uncheck that, then if I save this edit, I made I guess it’s going to disappear?

Matías Ventura  13:41

Yeah. And, it’s not going to commit it. And it’s going to leave it like that if I go ahead and save here. It will remain with unsaved changes. 

Matt Mullenweg  13:56

Hmm.

Josepha Haden Chomphosy  13:59

I think that this particular interaction is, like, it came up in our user feedback also during our outreach program. And so, we see that that is a confusing interaction. But, I agree that it’s not clear what’s gonna happen if you click…

Matías Ventura  14:19

I think, also, to be honest, this is a bit too powerful right now. You can essentially modify any of your post’s actual content, feature images, and so on. This should probably not be the default. It should probably be something that you have, like, one more step to get there.

Matt Mullenweg  14:42

Like zoom-in to edit it in post. 

Matías Ventura  14:44

Yeah, exactly. And by default, it should be a bit more view only because if you display in all your posts, that’s a bit more intuitive. So, the way it works now is mostly because we need the system to power all the other things we need to do on the templates. But I don’t think it should be the default. Especially in this view if I’m showing a grid of posts. If I’m in the single post template and modify that, then it makes more sense because it is the post itself. 

Helen Hou-Sandí  15:24

Yeah, I struggled with this a lot when I was testing with making, like, my own block based theme, was understanding, “is my change just gonna apply to this individual item? Or does it apply to everything else?” That was a real struggle, and it felt like, I don’t know, maybe from a developer perspective, but if you have a query that is multiple items, maybe you shouldn’t be able to edit each item inline because it just feels like mixing too many things. It does make sense when it’s an individual item – multiple text change.

Matías Ventura  16:01

Yeah, it’s similar, not the same, but it’s similar with Reusable Blocks. We used to have more of a boundary there. Now, we don’t have that boundary. It goes through the same saving flow. It’s still separated, and so on. But it’s not necessarily the most clear. We need to treat them a bit more similarly. A lot of these, because there’s starts to be a lot of power, that you want to know how to get more clarity what’s going on. And currently, that happens. Everything happens in the published flow. And I don’t think that that’s enough.

Matt Mullenweg  16:44

There is also a lot going on in breadcrumbs in the bottom left there. 

Matías Ventura  16:48

Yeah.

Matt Mullenweg  16:50

That is not truly a breadcrumb. It’s like saying the name of the block, but not that you’re in a different post and editing it. 

Matías Ventura  16:56

Yeah. Yeah. I think, like there… I’ll get to the list view in a bit, but I think the list view is a better representation of the same thing. But let me see. I wanted to cover something else with the query? Oh, yeah, the, because the query also has another complexity, which is that depending on where you’re using it if you’re using it in a template, this is more for the site editing. You inherit the context that you’re in; if you’re in an archive page, it will inherit the anchor tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) or whatever you’re doing. But you can also do like a fully custom query. That allows controlling how many posts I can go back to just one post and stuff like that.

Matt Mullenweg  17:57

This is pretty challenging too, the next to the inherit query from URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org setting.

Matías Ventura  18:07

It’s very challenging. And it’s also like, not clear at all, what inherited query means, I think.

Matías Ventura  18:15

the

Matt Mullenweg  18:16

Yeah.

Matías Ventura  18:18

It’s,

Matías Ventura  18:18

I think this is something that we need to make more magical in the sense of, like, we need to know, if you’re adding this in a page, it doesn’t make sense to inherit the query. Like, you’re just building like, you want to show different posts. If you’re in a template where the query matters, we should probably describe the template you’re in like you’re in an archive. So, we’re showing these posts and such and not make it…

Matt Mullenweg  18:47

Yeah, I almost also want to like, introduce the concept of like, why query strings, how that translates from URLs to arguments and link to WP Query, I guess? Like a lot is going on there. 

Matías Ventura  19:05

Yeah. Yeah. I think that’s, more generally, one or both a challenge and an opportunity we have here, which is teaching a lot of these concepts that have been because this is opening up a lot of tools for more users. Now you, again, get access to the 404 page. You get access to things that you can customize. But that comes with baggage as well in understanding what all these things are. I think it can be an opportunity to also clarify, again, many things that are implicit knowledge or have been the sign around what theme developers use, what developers use, but not necessarily what users might understand.

Matías Ventura  19:48

The query is one of those. It’s very clear, if you’re a theme developer, what the query does, but now that it’s exposed to users, I think we need to be much more diligent. 

Matt Mullenweg  20:01

I think we want to be the right type or verbose and never be a dead end. So, I could imagine people just copying and pasting that sentence and Googling it. Just realizing, “what the heck?” So, there should always be, like, a next place to go if you want to go down the rabbit hole. As much as possible, being explanatory. 

Matías Ventura  20:23

Yeah.

Josepha Haden Chomphosy  20:25

I’m gonna real fast give us all a time check. We are about halfway through our allotted time. Firstly, are folks OK going over an hour? That’s all we had set aside for this.

Matías Ventura  20:41

I don’t know if

Josepha Haden Chomphosy  20:43

We’ve got an “eh,” from Matt. Matt and I are both at “ah, we have things coming,” but we’ll try to get through this as best we can. 

Matías Ventura  20:51

Yeah, okay. And I think even to this topic, there are other loose ends. For example, from the query block, we can also teach people how to add a new item, a new post. We have it here right now like you can create a new post. But this is, I think it’s important to cover all these sorts of flows and loose ends so that you’re not stuck. Because it is going to be very common that someone wants to add a new post, and they will probably click one of these pluses here to add, like, a post beneath, and they wouldn’t understand that it’s not creating a post. Again, it’s part of ensuring that there are no loose ends and that we can connect that better. 

Josepha Haden Chomphosy  21:38

Never is a dead end good.

Matías Ventura  21:42

Okay, I’ll move on from the query. But I think the query alone is a huge thing that still needs a bit of mostly polish in how it presents. I think it generally works pretty well. It can be a super powerful tool for other block builders. Again, it covers any post type. If you want portfolio items, whatever, you’ll be able to use them. We have some good patterns, but I think it needs some work on the presentation still.

Matías Ventura  22:17

The other blocks are a bit more self-explanatory, like site title, site logo. This one’s; still, the site logo needs a bit of feature parity with the Image block. There’s a bunch of tickets that cover that. It doesn’t have the inline cropping that we have on the Image block. It’s a few of those things. What else? The other thing is how it connects with the site icon, favicon, and that stuff.

Josepha Haden Chomphosy  22:53

If you change that here, does it change it for the whole site? 

Matías Ventura  22:57

No, because WordPress treats those two differently. And the site icon on the site logo are two things, which is a bit confusing. So again, I think this is a good chance to connect the two things. I think there are valid use cases for having the two be different. But that should not be. In many cases, it shouldn’t be the norm. And at the very least, when you upload a new logo, there should be a way to ensure that I want to use this as the site icon as well. 

Josepha Haden Chomphosy  23:26

Perfect. 

Matías Ventura  23:28

We have a bunch of issues for that. But I think that for the most part…. 

Matt Mullenweg  23:34

A good flag is whenever the title of something is also repeated in the description verbatim. So, like in that way, it was like “site logo.” “This shows the site logo.”

Matías Ventura  23:52

Yeah, and these descriptions, I think, are in general very underused. 

Matt Mullenweg  23:58

Yeah, I want so much more there. Essentially, I want the things you just said. If you’re like, “yeah, this is the sentence that describes that thing,” I really want that there. 

Josepha Haden Chomphosy  24:12

I think that it sounds like we need just a general copy review on all of these things. So we can make a note of that as well. 

Matías Ventura  24:21

It’s also a place to add a bit of personality that we’ve done with the older blocks. I think that we’ve done a good job there. I think the Image blocks say something about like, “An image is worth 1000 words,” and stuff like that. I think it’s a good place to inject some of that. The same with the examples of each block. Like what we used to fill in these, like the pre-formatted text in the first scene of Citizen Kane, for example. Stuff like that that can be nice to have. Like the various block, obviously.

Matías Ventura  25:10

Okay, so the site title. And this one has a bit more information. We updated this before. And I think it’s a sort of in this vein that we should be going, because, again, telling the user that this is generally using the address bar, and in Google, if you search and that kind of stuff. It also has a few more touches… 

Matt Mullenweg  25:36

When it says settings general it’s linked to settings general.

Matías Ventura  25:39

 Yeah. Yeah.

Matt Mullenweg  25:44

Maybe that’s also a place we can bring back a raw quote. Yeah, but let’s use the same thing there.

Matías Ventura  25:56

And then this one, the good thing is that it’s connected with I’ll touch on theme.json very quickly. But the typography tools that the theme will be able to control, sort of exactly what’s available to the user here, based on the tools we offer.

Matías Ventura  26:20

Site Logo… The other one that we have, this one we’ve had for a while. But now the interesting thing is that it can be added to, like a navigation block.

Matías Ventura  26:45

So if you have a navigation block. Not this one… So you can have a navigation block within the navigation menuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site.. But the default is not great because you would need to unclick a lot of these options. After all, the search block started mostly as a widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user.. So it came with a lot of accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) requirements as well, like having a visible label and so on. But in the context of the navigation menu, you probably want to remove a bunch of these things, like these need…

Matt Mullenweg  27:27

How do you choose which of those are in that little top bar versus what’s on the side?

Matías Ventura  27:37

Yeah, that’s a good question. The general principle is that the block is divided between primary, secondary, and tertiary tools. We consider the canvas of the block like anything. You can directly edit; the most important stuff, like changing the text, and so on. The secondary tools that are important to the block should be in the toolbar as much as possible. And the sidebarSidebar A sidebar in WordPress is referred to a widget-ready area used by WordPress themes to display information that is not a part of the main content. It is not always a vertical column on the side. It can be a horizontal rectangle below or above the content area, footer, header, or any where in the theme. general is treated as more advanced things that are a bit more indirect or a bit more where you dive a bit further into the blocks. This is not equally applied. I think there are many blocks that are offenders of not doing this.

Matías Ventura  28:22

I think we need to; we have it in sort of the block human interface guidelines, but I think it’s something we need to be a bit more. We’ve been doing work to clean up the toolbars a lot and make it more clear what they do. I think that the image is a good example because there’s even a hierarchy within the toolbar itself. Like, we have block-related tools, transforms, and so on. We have image-specific tools. And then there can be even some metaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. stuff that sometimes belongs in the toolbar.

Matt Mullenweg  29:05

And do we have any opportunity for that, I guess primary interactions, the icons, to say what they are or explaining them? 

Matías Ventura  29:15

For these ones? They show tooltips, and, yeah, they have tooltips if you hover and if you, depending on which tool, it has… But again, this is another case where more context wouldn’t hurt when you open the menus themselves.

Matt Mullenweg  29:40

Can you remind me how you get to the tertiary options when you’re on a mobile width?

Matías Ventura  29:47

Yeah. We have it in “show more settings.”

Matt Mullenweg  29:52

So if I were really small, would that take over the screen? 

Matías Ventura  29:56

Yeah, it’s sort of like a full model thing. On the native apps, they call it a bottom sheet. So it lights up from the bottom because they can do that on native. 

Matt Mullenweg  30:10

This is a good example on the alt tech side. Like we say alt text, and we say its alternative text. And then it looks like we have a little info and a link to, hopefully, how to write good alt text. And the thing that’s missing is a Why. Why would you do this? 

Matías Ventura  30:29

Yeah.

Matt Mullenweg  30:32

It’s good for accessibility, good for SEO. Like people will be like, “Oh.” I could see that encouraging a lot more people to write alt text. Where does that link to just out of curiosity? To describe the purpose of an image?

Josepha Haden Chomphosy  30:44

Go hover on that link, please. Describe the purpose of the image link? If you would? Oh, that’s tiny! W3.org page on it. Oh, yeah, Matt, you said put that on.org, wordpress.org content?

Matt Mullenweg  31:06

Eventually, like, let’s link to the best possible resource on the web. And if it’s not us, let’s make ourselves the best possible resource on the web. Because then it’ll be ad-free, won’t have trackers, like all this stuff. Like a lot of these sites have a lot of ads and stuff. Yeah, I guess that’d W3.org wouldn’t. But, that could also be something awesome for the accessibility team. Like, what would be the most awesome way to teach people how to write great alt tags and make them want to? And, what would that landing page be like?

Matías Ventura  31:50

Okay. So there are many, many more blocks here to cover. But I won’t go into each one, but I think this already shows that even just getting all the blocks can be huge. It can even be a bit daunting. So I think we should even figure out if we should draw them out incrementally and pick them a bit more and ensure that they are really good instead of getting 30 all of a sudden. That could be overwhelming.

Matt Mullenweg  32:24

So blocks wouldn’t show up for me normally, unless I have a full site editing theme enabled.

Matías Ventura  32:31

So, that’s one of the things. Like, many of these still make sense, even outside of the site editing. There have been requests from people to have the Query block for pages; there are many things that they are doing, like blank template stuff, so that you can have the editor take over a single page. And they can use a ton of these blocks there already, even without having a fully FSE theme.

Matt Mullenweg  32:59

Should we do anything inside? OK, let’s say that ships? Should we label certain blocks or interactions as beta actually inside of Gutenberg? And the shipping version?

Matías Ventura  33:12

Maybe? Maybe, I don’t know. I don’t know what you’ll think. 

Josepha Haden Chomphosy  33:15

Can you restate the question? Sorry, I was taking a note about bundled themes.

Matt Mullenweg  33:20

Yeah, like query block. Let’s call the query block, like the best example, because it is so powerful and so challenging still. Should there be some indication before I select that this is like, beta or something?

Josepha Haden Chomphosy  33:36

Got it.

Matt Mullenweg  33:37

By the way, I don’t mind shipping beta stuff in core. It’s kind of what we’re talking about. It’s kind of neat. But users might – I don’t know if we are setting expectations correctly if there’s no messaging within the interface itself that you know there be dragons here. 

Josepha Haden Chomphosy  33:55

Come meet our friendly dragons, if you want.

Matías Ventura  34:01

I think it makes sense also because it can be if you see, like, all the theme blocks that we have now? It’s, it’s a bit daunting even to see how many how much stuff could be. Just having a badge there that it’s like, “this is a new thing,” you can try it but, it can be nice. We can also use the previews to clarify a bit more, like have the badge there. 

Josepha Haden Chomphosy  34:30

Looks like we have a raised hand from Helen as well.

Helen Hou-Sandí  34:35

I was just thinking like the individual blocks of cells, any that ship, feel like the individual block probably should not be beta-state. Like the query, block does not feel like a beta to me, so much as maybe it does a little too much right now and is not well described in always, but it doesn’t feel like beta in that it’s going to break now or in the future. Like, it seems to work fine. It just is not necessarily polished.

Matt Mullenweg  35:08

I think I’m using beta in the sense of the smoothness of the user interaction, not how we normally use it, which is like, will this break.

Josepha Haden Chomphosy  35:19

Kind of a “lab/in experimentation,” sort of space, rather than, like, “beta and could break space,” is what we’re… okay. With that, which

Helen Hou-Sandí  35:32

Lab is kind of cute.

Matt Mullenweg  35:35

You could call it that. 

Helen Hou-Sandí  35:37

I like the idea of like, here are some things that are, you know, like, your site’s not gonna break later if you try them. But yeah, you know it right now, you might find things that are kind of funny about them. The idea of something like a lab, that’s very interesting. 

Matt Mullenweg  35:54

And that can be better than overloading that term beta, which we use to mean very different things in other places. 

Matías Ventura  36:01

Yeah, we use it in the Gutenberg plugin itself to signal some of the features that are more experimental within the plugin, and we have many layers of beta there.

Josepha Haden Chomphosy  36:11

You gotta have a lot of knowledge about where you are.

Helen Hou-Sandí  36:16

We could use it if we wanted to distract everybody into, like shedding about what beta is. But I think otherwise….

Matías Ventura  36:27

The last thing I wanted to show with blocks and pattern is that now we have some APIs that allow blocks to be transformed into patterns. So this is just showing for a paragraph. So when you go to the transform menu, under paragraph, there’s a patterns menu that has, right now, there’s only one register, so it doesn’t do much, but you can transform your current paragraph for any block into patterns that are associated with that block type. This will be, I think, (again, we need more patterns, and so on, we need to figure out which blocks connect in it), but I think it’s going to be pretty powerful for many things that we know how to do. We always have this side-by-side image that we use as a cannery test to see how easy things are. And now that we can get patterns connected to blocks, it should be easier for someone to start from a single image and choose among different patterns for a gallery or whatever they want to do. So it’s like another dimension to block transforms that I think will be it’s going to be important.

Matías Ventura  37:45

Okay, we talked briefly about the breadcrumb thing; I just want to go here. So the breadcrumb that we talk about, I think it’s the next evolution, is sort of like this persisting List View thing that we have here. Now I’m like the site editing context. So, this thing is not just a drop-down, but it’s like a full panel. And it has some accordions. As you move between things, it highlights the relevant block on the right side. So you can see again, even in the case of the query, you can sort of understand a bit more what’s going on. Like all these post titles, you get much more. This is also super useful for patterns. If you insert a very complex pattern, this can help you understand what’s going on. And it has some again like even selection is like a sort of like showing you what’s underneath.  It’s going to have drag and drop. It’s going to have a few more things that you can do directly from this view.

Matt Mullenweg  38:52

Really cool. 

Josepha Haden Chomphosy  38:53

Question for… I was gonna ask a question about keyboard navigation. If you’re navigating that list view with a keyboard, how do you move from what you’ve selected in the list view into the block? Is it you select it, and then you’re put into the block with your keyboard or?

Matías Ventura  39:10

You center and it transfers focus to the to the actual block.

Josepha Haden Chomphosy  39:14

 Beautiful. 

Matías Ventura  39:15

Yeah, there are a few. As we add more interactions to the list view so that you can do more from the list view, we might need to… Like we’ve been talking with some folks that use screen readers a lot. They might need some modifier key to the like common enter or something if you want to do more operations on the ListView. But those are like more details.

Josepha Haden Chomphosy  39:41

And I think that we’ll see those once we get this out in front of more people as well. That we’ll start seeing some clear lines in there. Okay, great. Thank you. 

Matías Ventura  39:51

Also, the blocks that are template parts and reusable blocks will have a unique color, and you’ll be able to notice them differently. This is also related to the initial thing we discussed, should we be entering into a separate mode to edit some of these things? Like, we could do that with some of these. Like, you could. There’s a ticketticket Created for both bug reports and feature development on the bug tracker. that allows you to go from sort of this full site view to focus on the headerHeader The header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes., and the header becomes isolated. So all of those things are going to be important.

Matías Ventura  40:39

Right now, the list view is more limited, and it just shows you the blocks here, and it’s not persistent. So the moment you select something, it closes.

Matías Ventura  41:01

Okay, let’s talk a little just very quickly about the theme.json. I think I might need to stop.

Josepha Haden Chomphosy  41:10

I was gonna say I’m gonna give us a time check for folks. We have about 15 minutes left in the hour. Do we want to stop and have any questions, discussions about everything that we’ve discussed so far while Matias is working on getting that pulled up?

Helen Hou-Sandí  41:26

I’m holding a question that I think is related to the theme.json. 

Matías Ventura  41:31

Okay, I’m back here. Yes. And if I go to… Here, do you see my editor? Okay. That worked. So the theme.json. First, I’ll explain what it is. This has been sort of a mechanism to allow themes to… Again, to cover all of those things, we discussed how difficult it is to declare alignments, how difficult it is to add support for all these things. We had the old theme support PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 7.4 or higher functions. That started to become very unwieldy. There were just a ton of them to do basic things, and so the theme JSON is a way to try (let me go to the site editor again). Theme.json is what allows themes to describe what settings should be on blocks by default. It allows you to say what the color palette should be, what the font sizes, what the presets, and so on. It also governs everything related to global styles. So it’s, it’s doing a lot of functions. And I’ll show one first. So, for example, you’ll be able to say, the site title block that we discussed, I can disable certain features. Like I don’t want line-height to be available, I don’t want the font size to be available. I want that an actual color palette just for the site title to choose among colors that I pre-selected. So that’s the case here if you go to the site title.

Matías Ventura  43:29

The available colors are these; if I go to a regular paragraph, the available colors are a different palette. So this is mostly to offer themes a ton of flexibility in, again, what sort of maybe the theme developer or the site maintainer wants the site title to only have preset available. So I can only pick among like a huge site title, a large site title, but I don’t have custom font size controls there. And I have this letter case thing, but I don’t have line-height, for example. 

Matt Mullenweg  44:05

I’ve been thinking a lot about this because, let’s say, my theme does this. I’ve also just seen a cool tutorial on YouTube or documentation for things I can customize. How do I know that my Gutenberg is not broken? Or my WordPress isn’t broken? Because these options aren’t available to me. 

Matías Ventura  44:23

Yeah, I think that’s a good point for how we should frame what things should do. I, for example, think that things should not be, like, the theme.json should be something that some site maintainers do. If you’re an agency or have a very specific brand, it’s more for the site maintainer to enforce what they need to for a specific case. But if you’re developing a theme and releasing it in the directory, all of these things should be open. We should probably check that all of these things are open to ensure that these things work.

Matías Ventura  45:02

It also interrelates with patterns a lot because patterns use the same sort of attributes underneath. It’s designed so that if the theme has themes locked down, but the pattern is using them, it still works on the button. It shows that it’s not visible in the UI. But, it’s a, it can be a complicated puzzle, and I think there will be a lot of education and setting like good, good expectations, because we’ve been quite conservative, because there’s been, again, the moment you started having line-height, and so on, like, people naturally think like, “oh, now users are going to like sort of destroy the design very quickly.” So all of these things are in place to allow that level of control. But, we need to set some good expectations for what’s a good default. Like, the default themes, I think, are going to be important as well. 

Matt Mullenweg  46:05

I think I am thinking of it more from a user point of view. So that’s kind of like the norms you want to set, either with the theme directory or for developers. But, just for that user, like, how would they know? And I don’t know if that’s under Advanced, or things are grayed out. Or, you know, there’s a little message that says, “these are the colors set by your theme,” but I think it’s probably an area we want to be a bit more transparent.

Matías Ventura  46:32

Yeah, the other thing is that this UI is kind of horrible. It’s mostly like… it’s a developer playground for the most part. But the idea is that here, you will have sort of all the blocks with all the settings, and you’ll be able. Like, the user would be able to, now that you’re in this global styles context, they will be able to say I want these features to be toggled on or off. So they can do that themselves for their own site. So that when they are writing a post, they only see presets for font sizes. But if they go here, they can dive a bit more into all the tools, and we have some actual UI for, let me go to show quickly.

Matías Ventura  47:19

So here, this is what the actual global style design should be. So if you go to any of the typography tools, like all the things that are disabled, they are still here. Like, I can toggle line-height, and it appears. But I might still say, this is what I want to have when I’m just writing a post, so this would be the default set of tools. But the other ones are still there.

Matías Ventura  47:54

I think, again, a site would still need to be able to completely forbid some of these from being used for many reasons. But by default, the user should have access to at least see this is unchecked; I can check it back and get access to it. Or, it’s unchecked and grayed out, and I need to contact the theme or something.

Matt Mullenweg  48:17

Let’s make time for Helen as well, if you had something around this area.

Helen Hou-Sandí  48:25

Well, I have a lot of half-baked thoughts, I think. I definitely agree that it’s going to be confusing for somebody to think like, “Oh, I saw this tutorial,” or “I saw this screenshot, and how come I don’t have this thing?”  Gaying it out is, I don’t know, I don’t want to get into the weeds and details. But, you know, maybe there’s like a concept of like, here’s all the stuff that’s not enabled. And it’s like, but somewhere else so that they’re aware that it’s not broken there, you just can’t do it.

Helen Hou-Sandí  48:56

Something that I’ve been thinking a lot about, like at a higher level, is how we tend to talk about this as a control thing. But it’s much more, to me, much more about like, we want to be able to guide people to make choices that are good. And so, by removing some of these things, we’re taking them out of the default view. It’s kind of guiding them toward a better result. So that’s meaning more how I would think of it right. So yeah, sometimes you have to disable it or hide it completely. 

Matías Ventura  49:23

Yeah, and there are also like the other layer that blocks themselves can say which ones, because again, like maybe some of these control, like the upper case makes a ton of sense for the site title, you get more of these customization tools, but maybe for a paragraph, you don’t need all of these like it’s too much. So the blocks themselves need to make a choice on which ones are fine for the context.

Matías Ventura  49:50

But speaking of things disappearing, I think one issue we have right now that I would love to fix is that we ship with a default color palette in core. A theme can override that palette, and all of those colors sort of disappear. And there are many cases where you want to have the theme colors, but you also want to have the default core colors. And so this new design is doing that more clearly. Like, you would have the theme colors set aside, you would have the default core colors, and you would have space for your own custom colors. So, I think this is also an example of how we can do it more additive and not like. Again, it even happens with a gradient, like if a theme registers its own gradients, all of the other disappears, and it’s not super clear why.

Matías Ventura  50:40

It also influences patterns because patterns cannot use colors from the default setting because a theme might have overwritten them. So, the classes don’t become available to them. So if a pattern wants to use like a black color, it might need to just use a custom inline color to the clear black instead of falling back to the class, which would be much nicer because they cannot assume that this palette would be there. So I think this is like a case where we just need to ensure that we have more breadth of how we express these things. 

Josepha Haden Chomphosy  51:16

We have about five minutes. Oh…

Matt Mullenweg  51:21

When do you think we’ll have that?

Matías Ventura  51:25

I think we should have this for 5.8. Because this is just, it’s really it’s just one line on this theme.json thing. Right now. Again, right now you can override the palette like this, we’re taking these declarations to be I don’t want the core color palette, which is just make that a separate setting. Right. And make sure that this is added. And that should be that.

Josepha Haden Chomphosy  51:52

So we have about five minutes left. And I know that Matt, you said you had something to get to. I’ve moved my schedule around so Matias and Helen, you both said that you could stay a bit longer. And now I can also stay a bit longer with you all if you have more questions.

Matías Ventura  52:09

So I think that that covers the things that I think are mostly ready. This is the set of things that could be ready; they still need a bit of work. I think the main one that I want to touch upon with everyone here is the… So, we have this flow so that you’re editing. Say you’re editing a page, and you want to edit the template of that page. And you’ll be able to click on this edit template. And you would get into the template editing modes. So now you get all the other site elements for the page.

Matías Ventura  52:48

This will also allow you; this is actually in the branchbranch A directory in Subversion. WordPress uses branches to store the latest development code for each major release (3.9, 4.0, etc.). Branches are then updated with code for any minor releases of that branch. Sometimes, a major version of WordPress and its minor versions are collectively referred to as a "branch", such as "the 4.0 branch". I can then read on the branch itself.  The design still needs a bit of work. You can edit the template, and it becomes the full page. I think what we can include in 5.8 is the ability to have, in any theme, to have a fully blank template. Instead of requiring a full blank theme to do this, we can allow people to create a new template. And here, they will be able to design this whole page, is not the full site, it’s just for this page, but they get access to all these blocks so they can, again, they can essentially empty the template, and, I don’t know start from a pattern for example. And then my homepage is going to be this.

Helen Hou-Sandí  53:58

Is this for any theme or just block based themes?

Matías Ventura  54:02

For any theme. Like this is one, I think this is one thing that we can offer…  I’ve seen a few of the new theme releases that they offer themselves a blank canvas template. So, I think this is something that we could offer in general. If a theme wants to support, like a blank canvas theme, you can do it. It’s mostly for one-off pages, where you can have like a full, more like brochure thing or landing or whatever. But it can be, again, can be whatever the user wants it to be, and it makes patterns really shine, I think because it can take the whole page.

Matt Mullenweg  54:46

While we are here, can I throw in one thing before I drop off? And, please don’t stop because of me. But, you just illustrated there that when you were entering that pattern, it looked like something. But because you’re narrowing the width of the column, it looked very different when you inserted it. And then it got better when you expand it out. I don’t know if this is possible, but if that could be more of like zoom in and out versus shrinking the width content with. Yeah…. right.

Matías Ventura  55:23

I think the other thing here is that we need to allow patterns to use viewport base units so that they can declare these large font sizes and naturally shrink to the base on the available viewport. I think that’s an import that’s coming up a lot in these patterns that are like a design for a specific viewport. See them like in the, again, in the different modes is going to be visible to.

Matt Mullenweg  55:58

Just something to keep in mind. Please don’t stop on my behalf, but it was very good seeing you all. Helen, Héctor, Chloé, Josepha, Matías really appreciate this walkthrough. And I’ll be on SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. and everything if there’s any follow-ups, and I’ll watch the video for what I missed after leaving. So. 

56:17

Okay,

Josepha Haden Chomphosy  56:17

Thanks for joining. 

Matt Mullenweg  56:17

I’m going to make someone the host.

Josepha Haden Chomphosy  56:19

 You can make me the host. 

Matt Mullenweg  56:20

And this recording should keep going… or not. 

Josepha Haden Chomphosy  56:23

If not, I’ll re-record it. 

Josepha Haden Chomphosy  56:31

Oh, yeah, look at that my whole everything’s different. It’s gonna be… 

Matt Mullenweg  56:34

Now it says you’re recording it looks like so. Yeah. Cool.

Josepha Haden Chomphosy  56:39

Thanks. 

Matías Ventura  56:40

Bye.

Matías Ventura  56:43

Okay, let me go back to this. So we didn’t. So the reason, the main reason I showed that template editor for pages is because I think this is a smoother way to start introducing some of the full site editing tools, rather than have full site editing by default, which I think still needs some polish, especially, like introducing this whole dimension. For all the templates, I think this still needs a bit of work. I don’t think like my take right now is that this is not super ready. We also don’t have, like honestly, we don’t have many themes, like block themes that we can really ensure that this is ready. So that’s a balance that’s a bit tricky. I would be a bit worried about even introducing these navigation patterns because they would be very unique right now. So I think there’s many layers here that would need a bit more work. So I think starting with page templates could be a way to have a place for all these blocks we discussed and allow things to themes playing with it. Expose many of the gaps that we might still have, even in basic blocks that you cannot do, or the query or things that don’t fully work. And leave that time towards December for getting more block themes ready using this tool, polish that experience, and so on.

Helen Hou-Sandí  58:19

I have a question. Well, it was about navigation. No, the search block within the navigation area. So this was something I thought; I don’t think that the theme.json supports this, but it feels like what you were saying about needing to define, like a preset, but in a contextual way. It seems like something really important to this. And something that if we are going to ship, like being able to insert search into a navigation area, probably needs to be addressed. Because it feels, like you’re right, like when you eat when you insert a search into a nav menu like the theme should be able to say, “this is the setup for the search block that’s going to look best in this specific area.” So that feels like something. I don’t know how much work…

Matías Ventura  59:12

feels like. Yeah, yeah, it feels really crackly.

Matías Ventura  59:16

That’s exactly one of the main purposes of the theme.json is that it should support this nesting. So you should be able to say, if you’re in the navigation menu, these other blocks should have these default attributes when applied.

Matías Ventura  59:31

I don’t know that; I don’t know if we have many examples of that. Because like it should apply at all levels. Even if you have a, I don’t know a theme defines a sidebar area, and they need a paragraph in that sidebar to have like a different set of, even a different color palette or different attributes, the navigation in that sense is just a container block. It should be able to do the same.

Matías Ventura  1:00:00

I don’t think we can still do it so that from the search block perspective itself, it can detect if it’s within the navigation block, and we can just tweak it there. But like you said. Eventually, we would want the theme to be able to say exactly how it should be handled.

Matías Ventura  1:00:20

And in a way, that’s not just they can do it generically. But it would affect the search block apply to the widget area. And we don’t want that. So.

Matías Ventura  1:00:30

I think like we should probably Héctor. We should probably check if that’s going to make it into the initial release of theme.json, that support because it was part of the spec to allow this sort of nesting thing. But we might need; it would be nice to have at least a better default for the search. Because right now is really wonky.

Helen Hou-Sandí  1:00:55

 Yeah, it definitely feels like search within nav area specifically, could be a place to, to for core to be opinionated to.

Matías Ventura  1:01:07

Let me see, it’s even hard to get like it looks nice. 

Helen Hou-Sandí  1:01:11

It makes it look really broken. And then you stop trusting the live preview too, that’s what I noticed in testing it, just because the theme is that styling for that. And so you still end up having to save and refresh the front to see what will happen.

Matías Ventura  1:01:31

Yeah, I was like, it’s. It should be like… even this is like….

Helen Hou-Sandí  1:01:42

At least a preview tells you it’s gonna look weird

Matías Ventura  1:01:48

Yeah, I was trying even to see if I could get rid of the actual search using the button. But even to your point, some things should probably not even be present as tools. Like this should probably not be. Like, you should not be able to get the label in this context. 

Helen Hou-Sandí  1:02:10

Right? It looks horizontal…. I don’t know. 

Matías Ventura  1:02:13

So it shouldn’t also be the thing. It’s not just the default attributes, but also like, even what settings should be exposed. To even to simplify it further.

Helen Hou-Sandí  1:02:26

Accessibility people may not love that, but we’ll see. 

Matías Ventura  1:02:29

Well, it’s still, like, even if you’re the if you hide the label, it’s present on the screen reader only reading, so it’s still there, it’s just not visible. Again, in some context, that can be a problem.

Matías Ventura  1:02:48

Speaking of the navigation blog, I have a few things on the “could be ready for 5.8.,” but there are a few things that still need polish. It’s one of the most complex things. I think we need; if it’s going to be ready, we will need to do a lot more user testing with it in the time we have between now and 5.8. To make a decisive call there.

Matías Ventura  1:03:15

A few features should be ready soon, like being able to collapse to like hamburger menu or a toggle on mobile, like offering those options. The customization tools, I think, are fairly good. Like you can change a bunch of stuff in background colors and so on. And, we also have. I am going to switch themes really quickly. 

Matías Ventura  1:03:46

Okay.

Matías Ventura  1:03:55

I’m going to go to the navigation menu screen. 

Matías Ventura  1:04:02

This one says beta.

Matías Ventura  1:04:07

So the navigation menu screen this is for, again for classic themes in a way. It’s using the same block and everything, but it doesn’t change the way things are saved. So it still uses the custom post typeCustom Post Type WordPress can hold and display many different types of content. A single item of such a content is generally called a post, although post is also a specific post type. Custom Post Types gives your site the ability to have templated posts, to simplify the concept. for navigations, menus, and so on. So it’s mainly about the UI. This is also fairly close in some ways. It is nice that there’s a lot of things that you can do that are hard to do in the current navigation screen. Like sub, like adding things to a sub-menu and stuff like that. Those are really a bit tricky to do.

Matías Ventura  1:04:45

But, I think this one, if we were to call these user-ready, I think it would need some more user testing.

Josepha Haden Chomphosy  1:04:54

Yeah. And, I apologize. I got so excited about our most recent demo on this that I told people in public that I thought it was really close to shipping. And I was not right. And so I’m apologizing for the confusion that I added to that. Yeah, I think this looks a lot better than the first time around when Helen and I saw it in 5.6.

Matías Ventura  1:05:19

Yeah, for sure. It’s, it’s been, it’s been a super rough one. I think. I think it’s close. But again, I think it would; I still don’t like that we’ve been going a lot of back and forth in the way that like adding links works. Like, there are too many pop-ups, in a way. I think there was a design that was using the toolbar for all the manipulations that I think was a better one. It’s just had a lot of accessibility challenges. This is closer to the model we have for inline cropping on an image where when you engage the cropping mode, it replaces the tools in the toolbar. So I would hope that this stuff like searching, adding like even the URL, should show in the toolbar like I would like to see it like even the URL is not visible right now for any of these items you open this.

Matías Ventura  1:06:16

I think there’s if we can make the toolbar work for that. I think it can go a long way to make this less jumpy. Because right now it’s very jumpy, the moment you have all these things popping up. Which, I think, adds to the. It’s not super bad, but I think it adds to the feeling of I don’t know junkiness.

Josepha Haden Chomphosy  1:06:40

It’s not junkiness, but it feels a little bit frantic. 

Matías Ventura  1:06:45

Funkiness.

Josepha Haden Chomphosy  1:06:46

Oh, oh, I thought you said junkiness. I was like, Matias, how dare you!

Matías Ventura  1:06:48

Yes, I said junkiness, but I misspoke; I meant funkiness.

Josepha Haden Chomphosy  1:06:55

It does kind of make it feel a little bit disjointed in the way that you’re trying to work in that. Yeah, I get that.

Matías Ventura  1:07:02

Yeah.

Matías Ventura  1:07:04

And there are also like, even for a super complex menu where this deal would be better. Like if you have many nested levels and it’s really long, even this view can be fine. So I think like integrating this view well;  having a more, because it’s a bit lost here… I think that will be important. But yeah, it’s I think it’s in a much better place in general. I think it could be; it could be ready for 5.8.

Josepha Haden Chomphosy  1:07:35

Don’t toy with our emotions like that.

Matías Ventura  1:07:42

The other one is the widgets that we’ve been trying to get for a while.

Helen Hou-Sandí  1:07:52

I will take all of the critical blame on that.

Matías Ventura  1:07:57

That’s completely fine because it’s still a struggle. So this specific screen is okay; this one is working fine. The most critical one is the one in the customizer because I think the main issue for getting it before was that it was a huge mess. When you go into the customizer, nothing was editable, and so on. So now, they got it to a point where you get a Block Editor here in the customizer so that you can modify. This is not the best theme to demo because it only has footer widgets.

Matías Ventura  1:08:43

But, you can, I don’t know, like the test like you can manipulate it’s. Again it’s never going to be as smooth as in the actual editor itself, but at least it works. You can add any block like color.

Josepha Haden Chomphosy  1:09:04

Yikes 

Matías Ventura  1:09:08

They show more settings. Yeah, the settings load here as well, so yeah. Like, I think it’s getting to the point where this is probably as best as it could look in the customizer, all things consider.

Matías Ventura  1:09:24

Let me see… I don’t know how many of these things actually work. Okay, that works.

Matías Ventura  1:09:30

So almost everything like this should work fine. Or fine like I mean it works.

Josepha Haden Chomphosy  1:09:37

Literally functional. 

Matías Ventura  1:09:39

Yes.

Helen Hou-Sandí  1:09:40

Do o-embeds function.

Matías Ventura  1:09:44

Let’s see.

Matías Ventura  1:09:49

I need a YouTube URL. One moment.

Josepha Haden Chomphosy  1:09:56

I was gonna offer find you one but then I was like I don’t have good taste in music. I don’t want anyone to look at what I’m going to offer you to put in there.

Josepha Haden Chomphosy  1:10:07

I can get you a YouTube embed of a podcast. 

Matías Ventura  1:10:11

If you can because I’m operating on fullscreen.

Josepha Haden Chomphosy  1:10:13

I can’t do it. 

Matías Ventura  1:10:14

can send

Helen Hou-Sandí  1:10:15

Yeah. 

Helen Hou-Sandí  1:10:16

I’ll send you one of my Twitch streams. How’s that?

Matías Ventura  1:10:21

Do we have Twitch embeds? 

Helen Hou-Sandí  1:10:24

Oh, well, I export them to YouTube. 

Chloé Bringmann  1:10:29

I just added State of the WordState of the Word This is the annual report given by Matt Mullenweg, founder of WordPress at WordCamp US. It looks at what we’ve done, what we’re doing, and the future of WordPress. https://wordpress.tv/tag/state-of-the-word/. from last year, so you have options.

Matías Ventura  1:10:41

Where are you sending me these things? 

Helen Hou-Sandí  1:10:42

They went in the Zoom chat. 

Helen Hou-Sandí  1:10:44

I don’t know it that’s any better.

Matías Ventura  1:10:48

That shouldn’t be in the chats.

Matías Ventura  1:10:50

If I understand this UI, it should be fine. Wait, what chat? Show me a chat.

Josepha Haden Chomphosy  1:10:58

Is it better in Slack?

1:11:00

On. You’ve got it.

Helen Hou-Sandí  1:11:05

It’s in that weird floaty toolbar thing? 

Josepha Haden Chomphosy  1:11:07

Yeah, yes. It disappears when you need it the most. 

Matías Ventura  1:11:10

Okay. So embed. And fingers crossed. 

Josepha Haden Chomphosy  1:11:16

There it is. 

Helen Hou-Sandí  1:11:17

So it works. And not in the Block Editor. Yeah, I had that problem in full site editing, which is why I was asking. I think it’s, and I had some other problems. So I think there’s something wrong with where it’s trying to retrieve that O embed from. 

Matías Ventura  1:11:31

Yeah. There’s so there’s a lot of like, really rough things. I think even there’s a bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. where like if you type and you hit enter, it doesn’t register the new block as well. You need to click on it. There are several bugs that would need to be ironed out. I think it should be. But at least I think that the design is in a good place now. Or at least it makes sense in the context; even the inserter makes more sense, it feels more native to the customizer.

Matías Ventura  1:12:08

There are a few bugs because I wanted to show it with an actual theme with a sidebar and not just footer widgets because I think it makes more sense there.

Matías Ventura  1:12:20

Again, if we can get it actually to feel polished, I think it can be pretty powerful for most things. Because they don’t need to make any changes, they get access to all these rich libraries of blocks—even patterns for the sidebar, or footer areas, or whatever.

Josepha Haden Chomphosy  1:12:47

Other things you want to be sure to show us Matias, or questions that have been burning?

Matías Ventura  1:12:53

Yes, the two main things that I think are not ready, like from my perspective, are the global styles UI is nowhere near ready. And the mock-ups that I showed, like, this theme isn’t shippable from many perspectives. But we have this stuff that makes no sense to anyone. This should be seen as an interface for theme.json right now, but it’s essentially as usable for the user to write a theme.json, which is to say almost none. So to get that in a good place, we should do this design iteration, which I don’t think is going to be ready for 5.8.

Matías Ventura  1:13:48

So that’s one thing that I would push to December is the UI for global styles. But I would keep the theme.json infrastructure in 5.8 so that themes can start doing all these other things. We even have a few months to polish it, so that come December, we have more robust handling.

Matías Ventura  1:14:11

And the other one that I think is… it’s not that it’s not ready. I think that, in many ways, it’s just too much. We could have spent all this call just focusing on each block that we will be introducing. Having the query, the theme.json, all the stuff that we discuss, plus the full set editor with all the templates, I think would be too much.

Matías Ventura  1:14:38

It would be completely overwhelming, not just to roll out in a release, but to the people receiving it.  There will be so much to process, and this doesn’t even touch on all the other things that would change in 5.8 that are just coming from the regular Block Editor updates, which there is a ton of stuff.

Josepha Haden Chomphosy  1:15:00

There are seven releases going in there or something. Yeah, it’s going to be a lot. 

Matías Ventura  1:15:05

Yeah.

Matías Ventura  1:15:06

Even if it were polished, I think we would need to stagger it a bit. 

Josepha Haden Chomphosy  1:15:10

Yeah. I also think for what it’s worth, and I know that I’ve mentioned this everywhere that I have been mentioning this process. But like, one of the things that we learned the loudest in my listening tour after 5.0 was the period for experimentation with it when people were confident that it was pretty much settled, was not long enough for agency partners, for theme and plugin folks, like we heard that really loudly. And I think that this, that the scope that we have right now helps us meet people where they are. Especially if where they are is we haven’t experimented with it, because we haven’t been confident that it was settled yet. So like, I think this is a gigantic scope as it is. And I think you’re right, that trying to put more into this is gonna be foolhardy. You didn’t say that. I said it.

Helen Hou-Sandí  1:16:04

I think I mean, on the agency side, people are just slow to adopt things anyway, right? Like that. Even with blocks. It’s like how long it has been, more than two years. And at 10 Up now like, my current thing is like, focusing a lot on custom block best practices. Just because I finally did my own client build. 

Josepha Haden Chomphosy  1:16:25

Congratulations on your fancy client build. 

Helen Hou-Sandí  1:16:28

Thank you. But yeah, it’s just one of those things for, you know, we’re still playing catch up in a lot of ways where we, you know, it was flagged two years ago, but you know, you like, don’t get to it, because there’s no real motivating factor. Right? And the other thing that’s really on my mind with this, and that, you know, I would agree that the bigger site editor stuff, you know, should wait, is that I feel like, if it doesn’t ship with themes that have that true one to one preview, and some mechanism in the editor to like, go into a view mode, right? Like, I’ve been talking to Anne about this a bit. Right, where like, there’s still like, some spacing, and like the hover interactions and everything, but it’s not like I’m actually looking at what my site will look like; there are placeholders. And so it feels like if we don’t have that, then people are just going to feel nervous about it because you still have to do the like save, refresh, save, refresh. Right. And I don’t think that that’s possible to hit by July.

Helen Hou-Sandí  1:16:39

Because like, I think that the level of like, when I say like one to one previewing, like, my way of looking at that it’s like, I really needed, like a one to one preview of a frontend. Yeah. So I’m sure that we all have that as a goal. But for me, that’s like a must-have to like, yeah, it’s not just about using it. 

Matías Ventura  1:17:59

It’s like, it’s the whole point. If it fails at that like, it removes that level of confidence, and it would be really hard to get it back. So in that sense, I think it’s, it’s good to say. I think there’s a lot of good work going in there. Like abstracting the spacing and the width and all of those things into the theme.json so that things can do it more declaratively, we can understand it better. We can ensure it’s the same and so on. So we can invest more effort there in getting that into a good place. Even the feedback loops, I think, right now, we don’t have many block themes around. We’re starting to see in the community sort of try to build them more, and so on. And that’s going to be like an invaluable source of feedback that I think it would be really good to take that feedback and have the time to polish these things. So that if we have something more, we can be more confident. 

Josepha Haden Chomphosy  1:18:59

And on that note, like, I’ve been in the last few days really thinking about what we can do around the bundled theme in the release at the end of the year that can help to really generate some interesting thoughts and ideas, not only around block themes for full site editing but also for the patterns because like, I’ve been saying it nonstop. Matias has, Matt has. Like the patterns and what that unlocks for users across our ecosystem really stands to be a game-changer there, and we don’t have enough of it, and the process for bringing them in is not tidy enough. But like yeah, I think that that is an area where more and more, we want to entice people to submit those options to us.

Matías Ventura  1:19:51

To be fair, it’s tricky to have people build more themes and patterns for this if the tools are not committed. I think that’s why I think it would be to get the blocks there so that people can start using them. And they can start, even the blank template, I think can help with that so that we can see. And people need to start using the query because without it; you cannot build a theme. So if we get those things out…

Helen Hou-Sandí  1:20:22

The query one for sure is one where at least agencies will look to extend the block because that’s a huge component. And it’s the thing that we’re constantly recreating. It’s just like custom query blocks that people call them content grids, or post list or, you know, just like a million different things and all the same freaking thing.

Helen Hou-Sandí  1:20:48

I know, I’m being recorded, by the way, so I’m not trying to be inflammatory. It’s just, that’s the reality, right. And we kind of like end up in more of like, this page builder type of mode for a lot of sites. I have this like, huge, it’s a huge, overarching thing, involving themes, and .org, and all that stuff, which is, I have no idea whether that’s something that would be achievable by the end of the year. But to me, what it feels like, and I know that everybody’s like approaching the same point.  But to me, it feels like for the bundle teams; I think we would really need to show that the power of this is that it takes away a lot of the technically complex PHP side things that theme developers have had to do. And what we really need to do is ship like a bunch of small block-based themes that are highly opinionated and highly designed.

Helen Hou-Sandí  1:21:48

Because the full site editing, like from a user-facing point of view, is not about page building all the time. It’s about tweaking what’s there. Yeah. So I feel like the correct thing for core to do in terms of bundled theme is actually a bunch of small bundled themes. And then on the.org theme developer side, it feels like foresight editing should be available on .org. So if you were able to build a block-based theme, using just a library or CC0 images that was available to you, patterns where any text that’s in there is like pre-vetted, right, no PHP, and you can like copy-paste the style sheet into there to style your things as you want. And then use global styles through your theme.json. So essentially, if you were able to create all of that within the .org hosted interface, full site editing, that would bypass theme review, like manual theme review. And we kind of end up in this like CSSCSS Cascading Style Sheets. Zen Garden era things again, right? Where your, but the themes are much smaller, and where people can really flex their creativity, instead of having to worry about like all the bits and pieces around, like how do you make a custom query? And how do you optimize it? And, you know, all that kind of stuff? So I don’t know, again, I feel like we could, if there were lots and lots of people working on it. And you know, we declared it, like, you know, priority and like people across different companies will work on it. But that feels like we’re approaching, and you know, what, what pieces need to be there for full site editing itself to launch and core? I don’t know, but that feels like.

1:23:37

No,

Matías Ventura  1:23:38

Well, and the pattern directory infrastructure can be super useful for that, because that’s already like, there’s already a place where you can go as a user, design a pattern and submitted to the directory directory from the .org site. Expanding that to full site editing makes a ton of sense to me, because that’s a it’s a very also, it’s also very eloquent way of saying. But again, you don’t need to do all of these PHP coding to handle these things. Because you can do it from… It simplifies reviewing, like you said. It can focus reviewing more on like, again, the design quality as well. And which would be, I think, will be an excellent thing to also get more designers involved that can like before, because it’s a pretty big, still a pretty big barrier for submit another design to learn how to do theme development. So being able to go from patterns to a full theme like that could be huge. 

Helen Hou-Sandí  1:24:32

Yeah, I definitely agree. And that actually, the patterns directory thing also made me think about the block directory where maybe a theme would want to include styling for certain blocks that it thinks would go well with that theme right to like a, I don’t know, like a food truck theme. There is one, by the way, that’s actually really cool. Like a food truck theme, it would want to support like a live updating, map block, or something. And, but you know, it cannot install it. But if in the template, it was able, like in the block builder, you could insert it because you’re on .org, you know, whatever. Then, somehow the editor can say, hey, the theme thinks that this block would look really good here or in the theme. Do you want to install it? I feel like that could also be like a compelling concept.

Josepha Haden Chomphosy  1:25:28

Y’all, I could technically listen to you all blue sky all day. I love you all dearly. But we also got stuff to do. So I’m going to go ahead and bring this to a close. I want to say again, thank you so much for dedicating this time to sit down and look at all these things with us. And with that, we’ll get everything processed and start filing tickets every which way. Sound good?

Matías Ventura  1:25:53

Sounds good. Sounds good.

Helen Hou-Sandí  1:25:56

Thank you so much.

#5-8, #core-editor