The Test Team helps manage testing and triage across the WordPress ecosystem. They focus on user testing of the editing experience and WordPress dashboard, replicating and documenting bug reports, and supporting a culture of review and triage across the project.
If you’d like to help test Full Site Editing, please join the FSE Outreach Program. You can find current calls for testing for this program here and you can join the fun in #fse-outreach-experiment.
The team gathers in #core-test. Please drop by any time with questions or to help out.
Tag Archives: fse-hallway-hangout
annezazu
7:42 pm on October 26, 2022 Tags: fse-hallway-hangout
Attendance: Rich Tabor, Damon Cook, Courtney Roberston, Paal Joachim Romdahl, Jeff Ong, Nick Diego, Vagelis, Sé Reed, Piermario Orecchioni.
Video Recording:
Topics:
The main topic centered around the work underway to wrap phase 2 gathered in this overview issue. Expect regular updates to this issue and know that other work will continue but there’s a big emphasis to complete the tasks outlined there.
As of last week, the following was in place:
Work has been completed (1)
Dev work is underway (9)
We’re in the design stage still (3).
Dev is assigned but hasn’t started (3).
Means work is stuck but there’s follow up to try to get unstuck (1).
Means work is stuck, either due to a problem or a time lapse of 14+ days, and unclear how to unblock (11).
From there, we dug into the following individual issues to chat through at a high level what we were seeing. At a high level, it stuck out to folks how many different explorations there are, conflicting designs at times, etc. By doing this work concurrently, these differences can be resolved and the solutions refined together.
We talked about how this was a change in the entrance to the site editor just as much as it was for navigating between content. There was a desire to be able to click on the site title in the nav component to take you to the front end of the site. We discussed the important of accessibilityAccessibilityAccessibility (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) testing for this change and it’s top of mind to test for the FSE Outreach Program.
Overall, this would be a great way to get a sense of how changes impact the entirety of the site and in creating a more unified approach.
When looking at this issue, various folks commented on how it feels like there’s a number of different modes and it isn’t always clear how they relate and don’t relate. Part of this is due to designs being in progress at various stages and including some work but not others.
We chatted about how the IA needs to improve around right/left sidebars. Is there a best practice for when to put things in left vs right sidebarSidebarA 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. in the design library? Are we at a critical point in that convo right now? What about RTL when it comes to moving where things “live”?
We discussed what consolidation of the various editors might look like and how the current work seeks to make everything more unified, with the option to edit content in the site editor for example.
Media library getting the “FSE treatment”
Previously, the outreach program had an exploration around media and site building leading Courtney to bring it up!
Feedback on the Quick Inserter prioritizing patterns in certain circumstances
We discussed some pain points around when the quick inserter prioritizes patterns, especially the struggle to be able to add a blockBlockBlock 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.!
Talked about having it be a user preference to start with blocks vs patterns.
There are generally two different mindsets when working with blocks vs patterns.
Could the slash inserter work with patterns? There’s already an open issue here.
Other topics and questions
Folks shared that responsiveness is still a big topic along with navigation block. Multiple people echoed both. Damon shared in the chat: “The Navigation block has SO much complexity, but tackling the challenges will likely surface many great ideas that can be rolled out to other blocks that have complete UIUIUI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing./interaction”. Finally, we chatted at the end about the history of the Query LoopLoopThe 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. block naming (why not loop?), where folks can report issues when 6.1 is out in the wild, and what’s next for the FSE Outreach Program.
Attendance: Carolina Nymark, Daisy Olsen, Manuel Esposito, Rich Tabor, Herb Miller, Ellen Baeur, Ana Segota, Evan Mullins, Damon Cook, David Bowman, Jessica Lyschik, Ed Beck, Courtney Roberston, Amy L, Rita Best.
Video Recording:
Topics:
Apologies for the lack of timestamps – this conversation was vast and deep, making it hard to separate out into specific sections.
Pain points with blockBlockBlock 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. themes, including naming conventions for color palettes/mapping colors, managing updates to the theme, oddities with switching between style variations/losing styles, and keeping up with all the various changes to CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress..
Pain points from users including “how can I change fonts”, using the navigation block, and confusion around the split between the post editor vs site editor (ie have to go into the site editor to manage styles).
Theme switching and the UXUXUX is an acronym for User Experience - the way the user uses the UI. Think ‘what they are doing’ and less about how they do it. around picking/choosing parts of Styles from a theme, which ties into this prior exploration.
Discussion around “Who are our users?” and how there’s a spectrum of use cases to cover from those who want a ready made theme to those who want to dig into the details. How do you build for each or all?
Discussion around having a pattern library/pool as a way to speed up development for themes with a note around how there are so many ways to build smarter for block themes and how much more accessible it is for designers compared to classic themes.
Discussion around using Figma and design tokens to create a system for updating/working with theme.jsonJSONJSON, 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.. The following links were shared: Figma Tokens & Style Dictionary (What’s used to transform the output for theme.json). This is currently being used by the VIP team at Automattic.
Discussion around custom blocks, when to build them, and why they are often times preferable due to the ability to completely manage updates rather than chasing after changes to Core. This led to a conversation around why themes aren’t able to require custom blocks (it breaks a users site when they switch away).
A follow up idea was shared after the hangout from Damon Cook to consider: “It would be super helpful to have a single Figma file with all blocks, colors, and properties that could go in a theme.json. It would undoubtedly be high maintenance and would have to be under active updates alongside new GutenbergGutenbergThe 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/ features being merged into core, but it could also have a webpage equivalent to markup/output. A WordPress theme Style Guide: Figma file with the equivalent of block output on a site for users to copy/paste the code into their theme and see everything on a page… kinda deal.”
Overall, while there is both excitement and interest in what block themes unlock, it’s also clear that there are a build up of pain points to address, whether through clearer resources or changes to Gutenberg itself. These conversations are just one way to start surfacing these themes (get it) and to begin finding ways forward.
We mainly talked through the following different posts that help show both the complex problems at hand and potential thoughts around how to approach solutions:
Throughout the conversation, we had mini dives into various topics, including talking about comparing patterns, template parts, and reusable blocks. We also discussed how there are various layers in which to approach this work from the end user level to the deeper technical considerations. The hope throughout it all is to make these more complex and detailed explorations more understandable and engaging.
What’s missing and what’s stopping people from switching to blockBlockBlock 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. themes
Responsiveness continues to come up with Ellen sharing how she built their own system to handle this for now, knowing that they can always switch over. She believes this is one of the main reasons people are holding back from switching to block themes.
Onboarding to the FSE experience was brought up, particularly around how confusing it is that the BetaBetaA 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. label still exists since that seems to imply it’s not usable. There’s an open discussion around removing the beta label (in time) on this exact topic.
The question came up around “How do we get folks to use block themes if there’s a beta label?” and how difficult that can be.
People are very confused about when to switch in general though, even if folks like Ellen are building things that are ready to go for production sites.
Communicating the value of FSE
Nick has done some hardcore testing with folks who are new to the site editor and when watching them go into the experience and they change the typography of paragraphs but then can’t with headings! Why? We need to take a look at consistency across the tools we’re providing people. People get very frustrated and confused when one block has controls and another doesn’t.
Block themes truly is a better experience for getting a design into WordPress but the confusion added is a bit sad for the project that it gets a rough reputation.
Right now, it feels like more of a communication issue to the end user around what they should actually do and what they can do with consistent communication. Figma does this well.
This has come up in DevRel for WP Engine. When you’re talking about the basics of how to do XYZ, this should be on Learn and in docs. When you’re talking about the cool, cutting edge stuff, we need more of that. “Here’s how to learn the basics of creating a block theme but here’s how to take it to the next level.”
We discussed how if we can standardize block settings across all core blocks but allow agencies to turn on/off easily that’ll be huge for the user experience.
Patterns and opening up tooling
We spent some time chatting about issues for unifying the pattern modals and patterns as sections work since having consistency in the interfaces for patterns and in the larger editor can really help folks take advantage of what’s possible.
In many ways, it feels like users can rely on patterns and/or learn by doing over time as they explore more tools. As a result, exposing those tools doesn’t feel as risky as a pattern can guide the experience and, if they do want to dive in more, they can have access to the tools outright.
We discussed how valuable locking is when it comes to patterns as a way to curate and guide the experience more.
We went back and forth on the question of “How do we get people excited about what’s possible rather than worrying about folks breaking things?”
Difficulty with terminology
Terminology is still very difficult and unfortunately folks need to be generally aware of what to use when.
We talked about how there have been different names for block themes, like “full site editing theme” or “block-based theme”. This is causing confusion and also differs from what shows up in the Theme Directory.
We discussed how difficult it is to find block themes in the directory since the tag you have to use is “full site editing” , which both isn’t intuitive and hard to find.
This led to questions around having a separate menu item for themes or improving the filterFilterFilters are one of the two types of Hooks https://codex.wordpress.org/Plugin_API/Hooks. They provide a way for functions to modify data of other functions. They are the counterpart to Actions. Unlike Actions, filters are meant to work in an isolated manner, and should never have side effects such as affecting global variables and output..
Ellen shared how it’s unattractive to put free themes in the directory – “who clicks on FSE to filter?” Discoverability is so low – it’s not featured enough. She shared that they don’t put any effort into free themes.
We all felt that the entire theme directory was due for an overhaul but were curious about what some quick solutions could be for now to make it more attractive and interesting to add block themes there.
Perhaps there could be a block label in the section below:
Limitations of the pattern directory
In talking about the theme directory, we discussed how neat it would be to find patterns associated with different themes, partially as a way to entice people to download that specific block theme and improve the user experience.
Ellen brought up how it’s not possible to add patterns to the pattern directory that use third party blocks. This sometimes prevents submissions for block themes who have specific blocks for their theme.
We discussed how the pattern directory is overwhelming for users yet also limited: you can’t use named variables for color palette + can’t use third party blocks + no curation.
The crux of the problem is t hat block themers are creating blocks to fill gaps with core right now which then limits what can be added to the pattern directory.
We discussed how there perhaps could be a filter to allow for third party blocks vs Core blocks. For those who want to venture into needing third party blocks, they could then opt in by filtering to show those.
@shaunandrews recently shared a post about pluginPluginA 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 dependencies so some of that thought/design could likely be re-used there.
Nick shared how for the new feature in 6.0 where block themes can feature specific patterns from the directory, it’s still not granular enough. It would be nice to be ale to disable all patterns but then bring in a few from the directory to feature. There’s an issue open for this topic already!
We ended the call talking about how these dynamics often fragment the community – people building premium themes or patterns rather than using the Core pathways. This then moves everything away from Core distribution channels and harms the community/branding/experience of WP.
Ellen described it as feeling like you’re building against something.
We ended the call talking about how important it is to share feedback, engage in discussions, and help influence the direction of where things go so we can get to where we need to.
Ed discussed how he wishes there were options to pick and choose only certain parts of style variations rather than whole variation.
In order for that to be an option, there needs to be a combination of improvements/changes including more granularity with saving, the ability to partially switch styles, and exposing more style options. This is somewhat touched on here.
Overall, the resounding question was “How can we make it less overwhelming for users?” especially if they might want to take advantage of aspects of the style variations without switching entirely.
Right now, there are two extremes without much ease for middle ground options: all the options to customize in Styles vs wholesale full switching between styles (with variations).
What could we offer for theme developers? If we can extend this for themers, they can manage more granular options for their users rather than CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress..
How can we curate the experience?
Colin brought up a very important topic around curating the experience for folks, especially clients. He asked whether there was an issue that summarized the various approaches being taken (there is not and I followed up after around perhaps creating a Discussion issue).
This led to a conversation around various curation options through theme.jsonJSONJSON, 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., template locking, and blockBlockBlock 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. locking, including being able to control who can do block locking with filters.
The question of “How can you build a theme and lock things down/curate for clients?” at the same time came up.
For example, clients need to be able to edit the navigation menuNavigation MenuA 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. and headerHeaderThe 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. but don’t touch the logo on the left! You could lock various items down to ensure things aren’t deleted.
In general, there was agreement that the power lies between theme.json and locking options.
During this conversation, a few folks from the agency world mentioned how theme.json is only useful if it works in tooling for existing agencies and design systems. For example, people are struggling a bit switching to theme.json from CSSCSSCSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site..
While, in time, folks should be able to rely on the site editor to build a theme, it’s a big workflow change regardless and not everyone is going to build from there. This is where the power of import/export functionality will be key.
Trying to push towards doing these things in theme.json but the amount of uncertainty around even just simply adding a theme.json feels nerve wracking.
We touched on the desire to standardize spacing options and have the same t-shirt sizing/spacing scale that is being done with typography controls. This will help guide the user while also give them flexibility to choose from some presets.
By having standardization, it’ll be easier to have content portability/theme switching/etc.
This conversation led to a discussion around how inconsistent the dimension controls are across blocks. It’s hard to know why one option is available in X block but not Y. There’s a sense they should all be available.
The initial reaction from two folks was “Ahhh two sets of tabs!” when first seeing some of the designs.
When thinking about the various tools, this brought up the question of “What’s a primary or secondary tool for each block?”. It seems wise for an audit of some sort to occur.
These pain points relate to both blocks not all having the same controls + understanding what’s in block toolbar vs sidebarSidebarA 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..
For folks in the agency world, there’s also an element of how different people need to look at each set of tooling (visual vs content focus) depending on what they are doing (are they a designer or a copy person?).
Keynote was shared as an example of an application that manages this experience quite well.
We went through the Query loopLoopThe 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. block as an example of current pain points.
We briefly talked about when does it make sense to have as a standalone block with different controls being exposed rather than variations that comes with inherent limitations?
This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. All were welcome! The intent was to chat about whatever was on folks’ minds as 5.9 is around the corner. Thank you to all who joined.
We kicked off the call talking about a few specific issues and use cases, like copying/pasting an image into an image blockBlockBlock 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. and being prompted to name an image upon pasting. I couldn’t replicate an issue here after the call but am following up via DM.
We dug into rethinking the role of a featured imageFeatured imageA featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts. in a full site editing world, including looking at a few designs.
We chatted about the overall pain pointPain pointPain points are “places where you know from research or analytics that users are currently getting hung up and have to ask questions, or are likely to abandon the site or app.” — Design for Real Life and desire for better media management (folders, rename files, etc). With FSE, things that used to be locked away are increasingly getting easier to work with to the point that there’s a feeling of wanting to be able to do everything.
We chatted briefly about how Openverse could integrate with the pattern directory and how the media library might be able to integrate with media related patterns. Overall, it feels really high impact to have your own images or an image you’re looking to use baked into a pattern you want to use as well.
We talked about how switching themes causes featured image changes in terms of sizing/cropping, which can be a bit annoying to have to refine and an extra step when switching themes.
The topic of uploading an image to the photo directory from one’s media library came up as it involves a few steps from how to connect to a WordPress.orgWordPress.orgThe 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/ profile to a potential way to see all your content in Openverse to how to connect multiple sites to the same profile and more.
@beckej was kind enough to share his screen to show off how he uses the Pressbooks pluginPluginA 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, which includes attributions in the media library. Since this is already a WordPress solution, it’s great to see how it’s being built and what it might look like. We talked about how perhaps it’s up to the author to choose from a few different style options depending on how they are using an image. Ideally, attributions can also match the theme style so that, upon adding an image, it immediately fits in.
We dove into what other tools do well (or poorly) that should be considered as part of WordPress’ media feature. This led to discussing how other services have paid connections (like squarespace) so don’t have to worry about things like attributions, which inherently makes the job WordPress has a bit harder.
The topic of attributions led to talking about how can we make attributions “cool”/the norm? Similar trends have come up with offering captions on videos on social media, an increasing number of folks sharing “props to @xyz profile”, and more folks paying attention to alt text.
As the photo directory grows, the question of how we can improve adding alt text to images came up as right now the description field doesn’t nudge things along too much.
We discussed how we can do things like show how an image is displayed elsewhere as a way to recognize content creators. Some folks might also not want to use a heavily used image and might purposefully seek out less used ones to have more individuality on their site.
We talked through how important that very first moment of using Openverse will be in terms of ease of use and how the attribution flowFlowFlow is the path of screens and interactions taken to accomplish a task. It’s an experience vector. Flow is also a feeling. It’s being unselfconscious and in the zone. Flow is what happens when difficulties are removed and you are freed to pursue an activity without forming intentions. You just do it.
Flow is the actual user experience, in many ways. If you like, you can think of flow as a really comprehensive set of user stories. When you think about user flow, you’re thinking about exactly how a user will perform the tasks allowed by your product.Flow and Context
works. If it’s magical and does things like matching the theme styles, it could really help with adoption.
We ended the call agreeing that the ability to disable Openverse integration will also be important. This has come up with the pattern directory too and feels standard at this point to have this kind of opt in optionality.
At some point during the call, Ed also shared a great example of attributions on a site where, at the bottom, there’s a drawer that expands and shows all attributions there. It’s great to see specific examples and how they are being solved as this might influence how something like a gallery might work.
I love the idea of pulling the first image as the featured image if there is no featured image. My role is I work in SUNY, working with students, and that’s something they always forget to do.
This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. All were welcome! The intent was to chat about whatever was on folks’ minds as 5.9 is around the corner. Thank you to all who joined.
We kicked off the call chatting about Page Builders and what folks might be expecting from WordPress 5.9. Specifically, there’s a sense that folks want to be able to do all of their favorite things from page builders in FSE. In reality, CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. is meant to provide a shared base all can build upon (include page builders) and extend as needed, including finding a pluginPluginA 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 that offers a more curated experience.
We chatted then about contextual patterns, meaning patterns being shown right when you need them, and the impact of the pattern directory to help folks build content quickly. Not everyone will want t use the pattern directory though so it’s likely this responsibility with fall to blockBlockBlock 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. themers or site builders to package things for users.
We jumped into a wonderful discussion on the impact of names and how confusing some of the names are. @ndiego went through a few names of plugins using the word “template” to highlight some of the current confusion.
This launched into a conversation about how eventually this is where the UIUIUI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. can play a role in not needing to know the names of things. Folks shouldn’t need to think “I want to add a template part here” but should instead only be presented with certain options.
This led to a conversation about the role and needs of early adopters! There’s a very real need for “descriptive, understandable, intuitive, and consistent language” (to quote @megphillips91) that we can all then use to educate others. Made a plug to share anything in this Glossary that might need to be updated since the outreach program can help there.
We briefly touched on some current pain points in the editor right now, like how we tell folks to “edit their site” yet it’s just called the Editor under Appearance. We also went through a few different ways the UI can help including colorizing various pieces and the power of locking.
We ended on a sneak peak at next call for testing! It’ll focus on the experience of media when building a site.
This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. The intent was to have a fun and open ended chat about what we each would like to see for WordPress 6.0 as 5.9 continues to take shape. This was not a call to make decisions or set priorities as a result but just to swap ideas, review various issues, and more. Overall, this chat really showed how the foundation being set for 5.9 is leading to great excitement about future WordPress releases and the features that might come.
We started the call talking about responsive controls after @thakurtech shared some great insights around the current experience with clients missing the ability to have more options, specifically with the columns blockBlockBlock 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.. This overview issue was identified as a great place to share this kind of feedback.
A lovely and well deserved shoutout was giving to @poena about all of her excellent work with https://fullsiteediting.com/.
Keeping up with WooCommerce changes related to FSE were mentioned with the best advice being to check out the WooCommerce GitHub repo and reviewing their latest changelogs.
We briefly chatted about the Comments Loop block and excitement for more robust comment abilities for 6.0, including integrated patterns.
The current experience of the Layout settings were brought up as an area that refinement and iteration is needed, from how it’s currently named/described to how to make it easier for folks to find.
The need for having more consistency with the “Preview Site” feature and/or implementing a Browse Mode was then discussed after @paaljoachim raised the topic ahead of time. Folks are going to expect similar functionality for Preview as the Post Editor and we still see folks viewing the front end of their site to see how changes are impacting the site, rather than being able to rely on what’s in the Site Editor. There was also a request to be able to drag around the current Preview in the site editor similar to what one can do with the template part focus mode. This is under discussion!
This led to a discussion around both expanding what templates can be created and unifying the experience with template editing mode and the site editor. For example, folks already are wanting the ability to add a custom template for a specific categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. of posts and there’s not a way to do that now with 5.9.
Generally speaking, there are still some discrepancies between the post editor and site editor. It’s a tough balance to strike to have both familiar tooling in both while also making it clear how the changes in the Site Editor are more global.
@fabiankaegy brought up how in the post editor the break points are no longer applying correctly due to post editor not being iframed yet! This is a big issue for custom builds when list view and the sidebarSidebarA 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. are open so there’s excitement for iframing coming to the post editor in the future.
We then dove into how the post editor experience might be improved for 6.0 by looking at an exploration from @shaunandrews on improving the post editor sidebar. A suggestion was made to include auto-detection of post formats!
We had a fairly lengthy discussion about all things Query LoopLoopThe 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. block including everything from wanting to see expanded functionality, more patterns, more variations, a revamped building experience, etc. This included talking about how folks who aren’t as technical might interact with it (likely through patterns and variations).
Add new functionality like no results found, sticky post, etc.
Change the category of the Pattern inserter to be more user friendly rather than relying on “Query”.
Consider having a welcome guide for the block.
Make it easier to change the number of posts displayed and clarify the concept of “offset”.
We touched on the Webfonts API and the excitement there to see this implemented, especially so testing doesn’t have to happen in three editors (amongst other things).
This led to a big topic around naming! What are users typing into Google already? What should folks call this experience far into the future? How can we communicate these concepts now? We had more questions than answers. From @overclokk: “About the editor naming, I made a video for Italian people to explain the difference about content editor, template editor and site editor because it is not so easy to understand which one to use when do things. Most of the search are about “gutenbergGutenbergThe 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/ editor”.
The oEmbed block was briefly discussed in terms of is needing accessibilityAccessibilityAccessibility (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) improvements. I’m going to track this down.
The modal for the pattern explorer was raised as a topic with an idea around whether there could be more visual overlap between the modal and the directory itself potentially. Either way, it would be excellent to have better organization for 6.0.
We ended chatting about the WordPress Photo Directory and possible future integration. It’s unlikely for 6.0 just due to the lack of photos but there was lots of excitement around the possibilities of integration in the future regardless! Consider this a nudge to submit your photos (especially cat photos!).
For the Go/No Go, we chatted about items we were excited for, including talking through @karmatosed wonderful patternspiration.com where she’s started to make art-like creations. This spurred the idea of a virtual museum of art made from blocks that yours truly just might try to make a reality.
From there, we moved on to walk through the various early design explorations for the Site Editing IA. This led to a lively discussion alongside walking through both the current experience and the various prototypes. We talked about the changes in colors between the different interfaces, how much friction to add/remove for various pieces, and which might make the most sense for 5.9. @fabiankaegy had some great feedback around including more than just the headerHeaderThe 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 footer for the Separate exploration but in a view only manner similar to what currently is available with locking things in patterns.
Finally, we covered the latest on the Navigation Editor and BlockBlockBlock 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. work. @get_dave was kind enough to talk through where the project currently stands with focus shifting to the Navigation Block in order to then lay the foundation for the Navigation Editor. A key part of this work right now is “separating the navigation’s presentation from its data in order to make navigations reusable”. This will allow both for easier block theme switching while retaining menu data and for menus to be edited in a template part without creating a local copy. If folks have time, check out these two PRs to help move this important work forward: Save Navigation Block data to a wp_navigation post type and Try using a template part in the navigation block.
This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. It was intended to be a casual walkthrough of the current call for testing with @sparklingrobots taking the lead sharing their screen. Big thank you for being brave enough to meander around the call for testing publicly.
As a reminder, there is still 1 week left to participate so please join in if you can.
Throughout the session, some specific issues were noted as problem areas to follow up on, including some previous reported and some new:
It’s not clear when you are adding a theme blockBlockBlock 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. outside of the Query LoopLoopThe 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. vs within. In this case, it was confusing when the Post Comment Count block wasn’t properly displaying the number of comments and it wasn’t clear the issue was that it needed to be within the loop. There’s an open issue to discuss this general phenomenon.
She had a desire to change the post excerptExcerptAn excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox. length, which has an open enhancement issue.
There was an issue with the post title overflowing outside the bounds of a Query Loop block pattern. Need to replicate and open an issue!
There was a strange Inserter issue where you couldn’t find any theme blocks based on the current block you were selecting. Need to replicate and open an issue!
The call for testing itself needed to have updated instructions as you need to install GutenbergGutenbergThe 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/ first before activating a block theme. This was updated live on the call.
Outside of specific points of feedback about the experience, there were also high level themes that became apparent as @sparklingrobots made her way:
They were confused about where various settings were expected to be, sometimes seeking out the block toolbar and other times the block sidebarSidebarA 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.. For example, it was unclear at a glance how to change width of overall query and how to change the number of posts displayed.
The placeholders for various theme blocks were underwhelming and often not informative enough to know quite how to customize.
She was confused by how by selecting one Query Loop pattern, they instead ended up with two Query Loops! This is part of one of the default patterns included in the Query Loop block and could cause confusion long term when thinking about having more complex patterns.
There was a desire for more dimension controls for various blocks including the Columns Block and Post Comments block. This is under active iteration!
We ended the call talking about how the future of the Query Loop block powering more user friendly variations, an integrated block pattern library, an overhaul of the IA of the various design tools, & more will help ease this current experience. For now though, we’re in an in between state where loads can still be learned to improve the default tools themselves.
Next Steps
@annezazu will follow up next week after she returns (she’s out Thurs/Fri) to replicate and open issues.
You must be logged in to post a comment.