FSE Program Authoring an Author Template Summary

This post is a summary of the thirteenth call for testing for the experimental FSE outreach program. As always, I want to highlight those who helped to bring others along with them in this latest effort: 

Shout out to @hage, @antigone7, @robglidden, @azhiyadev as first-time contributors. Get excited – you now have a testing contributor badge on your WordPress profile!

High-level summary

To help ground the following feedback, here are some quotes about the overall experience to keep in mind: 

The most frustrating thing to me is still, hands down, the lack of a clear, consistent visual cue or affordance to insert a new 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. on a new parent level after an existing block. Most of the time, when adding a block using the [+] square, the new one is inserted right there, still as a “child” block. List view often comes to the rescue and helps a lot. Without it, everything would be much, much harder to build..This, and the current lack of consistency in styling and spacing options between blocks (some have margins, some don’t, some have colors, some don’t, etc.) is still, in my opinion, one of the main factors keeping users from jumping ship from site builders. 

@piermario in this comment.

Outside of the user-experience issues noted below, everything went well. No editor crashes. No problems saving. And the front-end matched what I was seeing in the editor.

@greenshady in this WP Tavern post.

Outside of these quotes, a few items proved to be repeatedly mentioned by folks who gave feedback on this test: 

To provide a visual of what this test accomplished, here’s what @greenshady created in his write up for this call for testing:

Author template with a nice header showing a menu, site title, and author description on a light beige background.

Confirmed bugs

Listed below are confirmed bugs that break expected functionality or the experience of different features. 

Previously reported

New Issues

Feature Requests

Most requests in this section touch on items that would improve the experience of an option (quick inserter prioritizing patterns) or block (No results block) rather than a list of desired new functionality. This reflects the fact that much of what folks wanted to do in this call for testing they could reasonably accomplish compared to prior calls.  

New Issues

Previously Reported:

I did not know about the “No Results block”. That was interesting to learn about. Perhaps it should automatically be added with the default text if there are no author posts to show.

@paaljoachim in this comment

The Post ExcerptExcerpt An 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. block under the Query 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. doesn’t have an option to adjust the excerpt length. (The Latest Posts block does have this option.)

@piermario in this comment.

Working with the block felt odd at first. Where does it go? After the Post Template? Before?…It was also odd to visually edit a feature that is conditionally displayed. There should be an indicator that its contents may or may not be shown on the front end…Overall, the No Results block is a welcome addition to the theme-blocks toolset. I would like to see the UIUI UI 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. fleshed out a bit. Theme authors will likely start using this more when 6.0 lands, and I could see users inadvertently trying to delete it, thinking it is part of the default output.

@greenshady in this WP Tavern post.

General Usability Feedback

Once more, this call for testing showed the desire to avoid starting from scratch, more consistency across the experience (especially with what options are available to customize blocks), and more connection points between new options. In particular, the inability to link to the Author Template one customized in this call for testing using the Post Author block was repeated numerous times as a pain pointPain point Pain 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. The missing connection there lowers the impact the new author template could have. While this won’t be available for WordPress 6.0, expect to see the option to do so included when the new Post Author Name block is included in a future WordPress release:

The most immediate issue when creating a new author template is that it was devoid of default blocks. Where was the—at minimum—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 footer? The empty template would make sense if I was building something from scratch. However, this is not a from-scratch project. It was built from a theme with existing archive.htmlHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. and index.html files, ancestors in the template hierarchy…Users will most likely want to make modifications rather than start from scratch. Using an ancestor template as a base means that they are less likely to unnecessarily deviate from the existing layout, especially with more complex designs.

@greenshady in this WP Tavern post

I feel that menus were a lot more intuitive and easier to manage with the previous system. I wish there were a way to basically tie back the new blocks to a similar interface, which had become familiar and was easy to use even for non-experts.

@piermario in this comment.

I find it difficult in viewing the author template on the frontend and had to use your advice: yoursiteurl.com/author/[username].

@paaljoachim in this comment

I had expected that after locking the group block at the header, the cover block contained in it (for example) could also not be moved. But that was possible without any problems. In my opinion, another option would make sense here: Lock all blocks contained in the block. If a group block contains several other blocks, it would be very time-consuming to lock all of them.

@hage in this comment

#fse-outreach-program, #fse-testing-summary

FSE Program Hyping Headers Summary

This post is a summary of the twelfth call for testing for the experimental FSE outreach program. As always, I want to highlight those who helped to bring others along with them in this latest effort: 

Shout out to @itsjustdj as the sole first-time contributor for this call for testing. Get excited – you now have a testing contributor badge on your WordPress profile!

High-level summary

The feedback this time around focused on the edges of the experience, especially in terms of design tools, and on some key problem areas that have repeatedly come up around navigating the entirety of the experience, like knowing what templates are used where. On the whole though, there were no deal breakers, big crashes, or show stopping problems found. Here’s what a few people had to say about the experience that can help frame the following more specific feedback:

On the whole, this went surprisingly well. In a year, the site editor has become far more powerful…Without responsive controls on layout-type containers like the Columns 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., designing anything complex with the site editor can sometimes feel like one giant hack…There are tons of improvements with block design tools in comparison to last year…I hit no spacing-related problems in this experiment. That feels gratifying to say after over a year of testing FSE features. The experience of designing from within the site and template editors feels pretty smooth these days. The holdups are more about missing capabilities than anything.

@greenshady in this WP Tavern post

The Typography settings are particularly satisfying to play around with. It’s nice to have lots of design options before having to use custom CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site..

@itsjustdj in this comment.

Most of these things are editable in FSE, but it feels like it is up to the creator to explore and it feels a little like a scavenger hunt. I wish there was a way to surface the most important decisions in a linear way. Some kind of “Start Here” guided walkthrough that pros would ignore, but help casual users understand the capabilities of Full Site Editor.

@beckej in this comment.

The ease of laying out 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. with rows/columns and dropping in site elements (logo/site title/navigation) was awesome.

@cdils in this comment.

Here’s an example of what @greenshady created in his write up on this call for testing:

Header of a pizza restaurant with three different menus in separate locations over top of a picture of pizza.

Of note, since most feedback fell into the usability and feature request categories, the format of this post breaks down by feature more than recent ones that tend to stick with Bugs, Feature Requests, and General Usability headings to make it easier for those working on specific features to follow.

Potential bug

For the first time in this program’s history, zero bugs were found that could be replicated. However, there was one report that I was unable to replicate or find similar reports for that I’ll share below in case someone else can:

I added a spacer block below 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. and later went to delete it. It moved the content of my site around and my navigation menu was gone, so I reloaded which lost anything that wasn’t saved. It also crashed when I was adding Header Dark Small to the Blank template.

@courane01 in this comment. Check out the comment for more details.

Templates and template parts

With more options available for templates and template parts, there’s an increasing need for better organization and more clarity in the interface to understand the impact of changes, big or small (adding a new template vs editing a template part). This is compounded by the fact that most folks don’t have a strong grasp on the template hierarchy built into WordPress. With newer modes like the focus template part mode, there was also some confusion around why this should be used. This is partially due to lack of awareness around how it can be used in the future as a gradual adoption pathway and due to those pathways not yet existing visually in the editor.

The subtle differences between the FSE screen and the “Focus Mode” screen are a little confusing. Specifically, I really LOVE the new “Replace” button to choose between an existing template or a Pattern. But I wish I could “Replace” with a Pattern even in focus mode. If I came to this screen to really work on my header, why would I have less options here than I have when looking at the full site?

@beckej in this comment.

I really do not know which template affects which pages/posts. So I assume that a Page template affects all the pages. 

@paaljoachim in this comment.

Trying to select the correct group, row, or block in the layout can be hit or miss. When I think I’ve selected the correct one, I accidentally edit something else.

@itsjustdj in this comment.

Isolated mode. I do not see a purpose why I should use it. As I can instead just edit the template directly in the site editor.

@paaljoachim in this comment.

There was a small dot in an accent color under the “Added by” column on the Template Parts screen that (I think) indicated the original template part had been edited. Something a little more obvious there would be nice (for instance, under “Added by” maybe it says [Theme Name], edited by [user]).

@cdils in this comment.

Design tools

Since this test focused specifically on using the Navigation block, various missing customization options came up, particularly for anyone trying to do anything more complex than the average menu. The feedback here echoed previous rounds and underscores the importance of the work that’s underway to expand what’s currently available

The Navigation block may be my least favorite thing about the site editor. I have yet to see how it will offer a universal system that plays well with the 1,000s of design variations that theme authors will want to employ. Classic nav menus are still vastly superior for custom design.

@greenshady in this WP Tavern post

Patterns

With patterns being increasingly integrated into the site building experience, new pieces of feedback are arising around pattern management. This includes everything from naming best practices to when options should appear to swap between patterns and more. 

Since I had changed the default color scheme on my site, I was confused at first looking at the pattern names. For example, I had set my primary color as Blue, so “Text-only header with green background” was confusing to me at first because it was blue.

@beckej in this comment.

General Usability Feedback

Cutting across the entire experience, familiar feedback came in that touches on some key pain points in the current version of site editing. All of these items have been previously reported:

Of note, it feels important to call out recent work in progress in the dedicated UI for navigation structure, since this both improves the information architecture by grouping site wide tools and implements a form of browse mode many have asked for to make it easier to see more parts of your site as you create. 

Clicking Header or any template section is somewhat difficult, as it easily selects blocks inside of it.

@paaljoachim in this comment.

I miss some of the common controls that were part of every WordPress Customize screen. I wanted to edit my site to have a static homepage and a blogroll elsewhere. I feel like homepage settings, custom css, menus should be somewhere in the FSE experience.

@beckej in this comment.

#fse-outreach-program, #fse-testing-summary

FSE Program: Answers from Round Four of Questions

This post is part of a wider series that provides answers to questions gathered through the FSE Outreach Program. This round of questions was started on March 16th and ended on March 30th. Thank you to everyone who submitted a question so our knowledge can grow together! Stay tuned for future rounds and join the FSE Outreach Program if you’re keen to both learn more about these features and help shape how they evolve.

Continue reading

#fse-answers, #fse-outreach-program

FSE Program All Things Media Summary

This post is a summary of the All Things Media exploration for the FSE Outreach Program. Coming out of a pause from 5.9, it was so encouraging and wonderful to see the wider community help out with this exploration in the following ways: 

Shout out to the following folks as first-time contributors to a call for testing: @patrick-b, @ndiego, @beckej, @lidialab. Get excited – you now have a testing contributor badge on your WordPress profile!

High-level summary

While normally, there are some overall sentiments to share, this exploration was so wide ranging it’s hard to pull out a few quotes to ground the following feedback in. Instead, here are some patterns seen across the varying areas below that help bring together the feedback more cohesively: 

  • Emphases on making attribution easy while also allowing for the ability to filterFilter Filters 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. out images that require it, as few seem keen to use images that would. 
  • Inconsistency with tooling, whether using duotone to select a custom color or trying to crop an image in a gallery 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.
  • Desire for more expansive options, including featured images and adding YouTube videos as a background. 
  • Simplifying layout controls and increase in patterns to make it easier to place your content exactly as you’d like in a 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. or as a full width visual. 

In each section, the items are divided when appropriate into previously reported vs new categories in order to better understand what was underscored as part of this exploration compared to what was found. 

Confirmed bugs

Listed below are confirmed bugs that break expected functionality or the experience of different features. 

Previously reported: 

New issues: 

The default dimension is highlighted as 100% but in-fact if clicking on 100% again usually modifies the image size on the editor. It is a bit confusing.

@alanjacobmathew in this comment

Feature Requests

Throughout each of these feature requests, there’s a clear desire for better and more consistent tooling, from background support in Group blocks to having a focal point picker for a featured imageFeatured image A 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.. It’s obvious there’s a dance to get right in adding more features while also creating a more consistent and intuitive experience in handling media in the Site Editor. 

Previously reported: 

New: 

Where one can define specifics on upload. Is it a bmp or other none web format have it be converted to a jpg. Have larger images downscaled to a kind of max image size. Etc. 

@paaljoachim in this comment

A uniform way to import images from external sources. There’s some inconsistency here that can be very confusing.

@trynet in this comment.

Having a way to include Featured images in a variety of blocks, such as Cover, would be amazing. This is in scope for 6.0, but it’s the biggest thing I would like to see regarding media and would enable a lot of interesting patterns.

@ndiego in this comment.

However, I would like to see a range of filters available to users. If this is too much for coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., perhaps a standard filter-registration system for developers might be in order.

@greenshady in this WP Tavern post

General Usability Feedback

As seen in other calls for testing, the experience of easily manipulating a Header proved difficult, whether trying to add a background image, trying to get alignments exactly right with your Site Logo, or in using various aspects of duotone. Tied to this, confusion continues around Layout controls with simple tasks like making a Cover block full width proving to be frustrating and further underscoring the need to simplify these concepts. 

Previously reported:

New: 

I went down a weird rabbit hole where I couldn’t figure out why we had the header block and the header template parts. I mean, what if I wanted to have two different headers with wildly different information in them? Whenever I changed the main header block (anything living inside it), it changed it in all the header template parts, and I found that very confusing and frustrating. I ended up removing the header block inside the header templates and keeping things just in groups. That made way more sense to me.

@aurooba in this comment.

I had trouble making my cover image full width. It’s still a bit odd to me that some controls only show up in certain situations, and in this case, because my cover was part of a group, I couldn’t make the cover full width. I’ve been teaching people to use that list view to try to get around that.

@beckej in this comment.

This is tricky and I bet is the hardest step. “Header” is not clearly defined. I bet most folks would go into the Site Editor and try to add a background image to the Header template part block. Also most block-themes have a Group block wrapping the inner content of the Header part, and Group blocks also do not support image backgrounds (yet). So you have to modify the content in your Header by placing it inside of a Cover block and then add a background image to the Cover block. This takes a LOT of in depth knowledge of the Site Editor to accomplish.

@ndiego in this comment.

Say I’m editing the padding dimension, then goes to modify the duotone, the entire right 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. goes to the top(back to media settings) and opens all the closed settings, which affects the user workflow. This also happens when changing the ‘alignment’ to ‘none’ or ‘full width’.

@alanjacobmathew in this comment.

If I insert 2 headers, applying changes to one affects both the header. Don’t know why it is happening.

@alanjacobmathew in this comment.

Thoughts on attribution

We chatted about this on the hallway hangout for this exploration (starting at 16:00 and again around 26:58) with thoughts on how to learn from tools like Pressbooks, how to make attributions more magical by reusing theme styles when adding them, and how to encourage best practices for folks. In general, folks were not keen to use images that required attribution as one can see in the quotes below.

This question evoked a strong negative reaction for me. I don’t know it means that attribution info wouldn’t be removable? Would it be watermarked on the image? Are we talking about metadata. Either way, if you can’t remove attribution from an image visually, I would never use such an image or images from such a resource.

@aurooba in this comment.

As long as we gave end users a few options, I really like the idea of making it easy for others to utilize the open-licensed images, and help guide them to do best practices.

@beckej in this comment.

I understand why this would be necessary in some circumstances, but I personally would not use such an image on my site.

@ndiego in this comment.

It’d be great to have a way from the media library or block settings to append any attribution required AND define where that displayed in templates. I’d like to display the attribution before post comments and after post content.

@courane01 in this comment.

General insights/questions on other photo libraries

We chatted about this on the hallway hangout for this exploration (starting around 24:41) mainly discussing how important it is that an open sourceOpen Source Open Source denotes software for which the original source code is made freely available and may be redistributed and modified. Open Source **must be** delivered via a licensing model, see GPL. solution rivals a paid one. Generally speaking, folks mentioned the following external image libraries outside of Openverse: Unsplash, Rawpixel, Pexels. Some questions remain as you can see in the quote below:

How might this work for other media types, such as audio and video? Would we want to hotlink it/embed from the source? What’s the risk if the media later is no longer hosted there? But also: hosting many audio and video files within most hosting environments is not ideal. If we make it easier to move mixed media from Openverse to the Media Library, what are the trade-offs?

@courane01 in this comment.

Desire for improved media management

A longstanding conversation in the WordPress project is around having better media management from folders to better filtering and more. This desire held up with a discussion around whether Openverse might be able to solve some of these issues as a media hub. Here’s a video from @paaljoachim expanding on the idea:

This has been a longstanding request in the WordPress community, but better media management in the Media Library (i.e. folders) would be extremely helpful, especially for site with 100s of images.

@ndiego in this comment.

Watch feedback videos

Folks were kind enough to record videos of themselves walking through the experience that I wanted to reshare below as it’s neat to see folks in a great bandwidth medium share their thoughts:

From @paaljoachim.
ExcerptExcerpt An 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. from @aurooba stream.
From @beckej.

#fse-outreach-program, #fse-testing-summary, #full-site-editing, #media

Hallway Hangout: Let’s talk about WordPress 5.9

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.

Attendance: @elmastudio @ndiego @jeffpaul @rbest @megphillips91 @marybaum @piermario @bobbingwide

Video Recording:

Topics Covered:

  • 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, CoreCore Core 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 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 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 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. 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 UIUI UI 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.

#fse-hallway-hangout, #fse-outreach-program

Hallway Hangout: Let’s talk about WordPress 6.0

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.

As a friendly reminder, please help test WordPress 5.9.

Attendance: Thanks so much to everyone who took the time to join. It was so neat to see folks before the year ends. cc @poena @fabiankaegy @overclokk @courane01 @anoopd @thakurtech @annezazu @azhiyadev

Video Recording:

Topics Covered:

  • 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 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.. 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 categoryCategory The '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 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. 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 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. 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).
    • Consider creating a builder for the Query Loop block.
    • Add filters to extend the block and help prevent the need to fork it.
    • 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).
  • We dove deep on the topic of block theme switching, being able to schedule changes, have style variations, and the possibility of a style directory! This included checking out @critterverse‘s design explorations on block theme switching and style variation switching.
  • 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 “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/ editor”.
  • The oEmbed block was briefly discussed in terms of is needing 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) 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!).

#fse-hallway-hangout, #fse-outreach-program

FSE Program Site Editing Safari Summary

This post is a summary of the eleventh call for testing for the experimental FSE outreach program. Once again, I want to highlight the fantastic broader contributions surrounding this call for testing that enabled even more people to be a part of this work: 

Shout out to the following folks as first-time contributors to a call for testing: @colorful-tones @anjchang @mburridge @paulbigai @luminuu. Get excited – you now have a testing contributor badge on your WordPress profile! Thank you too to @piyopiyofox for kindly reviewing this post.

High-level summary

Here’s what a few folks had to say about the experience that can help frame the following more specific feedback. Overall, folks found the exploration to be easy enough to use with some minor enhancements and a few surprises. However, once most folks got beyond the basics, they found pitfalls in understanding how things might work together and how to accomplish different, slightly more complex tasks. This included everything from wanting more granular control of different link states with the Styles system (hover, active, etc) to confusion around how to change the width settings for new templates. This was the first time the Styles system was explored in a call for testing as well and, beyond a UXUX UX 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. issue mentioned by four folks and some feature requests, the feedback was generally uneventful and positive. 

This very much feels like where the state of the 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. and site editing is overall. Many pieces are exceptional, but after digging beneath the surface, you find that you need workarounds for some essential design needs.

@greenshady in this WP Tavern article.

As usual, with WordPress, also with bleeding edge experiments, it seems there is almost always a way to achieve the same result using different paths…Not had any crash or unattended interruption, so the current developing stage is showing a robust application. The improvements on each area done so far are impressive, sure we have tons of things and features to come.

@paulbigai in this comment.
Image of a homepage with black and white images arranged in a three column layout.

Confirmed bugs

Listed below are confirmed bugs that break expected functionality or the experience of different features. Thanks to this test running during the 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. cycle for 5.9, many of these are already fixed.

Fixed

New Reports or previously reported

This resulted in the entire background of the posts list to change the background color. I was expecting that only the actual lists blocks would change when adjusting this setting, instead the entire page background of the query block changed.  

@luminuu in this comment.

The biggest, ahem, hiccup that I ran into wiped all of my progress when editing my 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.. I tried to transform one of the outer Group blocks into a Cover to give it a background. It wiped everything in the header area clean, and the “undo” button did not seem to work. I just started over.

@greenshady in this WP Tavern article.

Feature Requests

As folks dug in, there were numerous enhancements that quickly came to mind as awesome nice to haves. These desired enhancements not only underscores the potential of various full site editing pieces when put together, but also highlights the frustration around the current limitations:

I started by removing the Page List block from 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. in the header. I have 90+ pages on my install, and it is always irritating when themes list them all by default.

@greenshady in this WP Tavern post.

Post Featured Image selected I expected to see to see similar options as the Image block. Example Image size: Full Size, Large, Medium or Thumbnail.

@paaljoachim in this comment. 

I miss a way for Global Styles to have more granular control over the links states, for color and the style in general. We have only one setting for link color, nothing for hover, active and visited state, neither the possibility to change the style applied, with TT1 Blocks we have the theme default text-decoration-style: dotted; for instance.  

@paulbigai in this comment.

General Usability Feedback

Thanks to videos from a few folks as part of this call for testing, I’m including less issues and quotes and more descriptions in order to capture the great feedback that was shared. 

In @courane01‘s wonderful testing session, the Navigation block placeholder proved to be quite confusing when it comes to WYSIWG (what you see is what you getWhat You See Is What You Get What You See Is What You Get. Most commonly used in relation to editors, where changes made in edit mode reflect exactly as they will translate to the published page.), especially if you haven’t yet set a menu. There are improvements to this placeholder setup that are being iterated upon as I write this. Tied to this, switching which menu is shown after selecting one also felt tricky, likely because there were a number of empty menus. Thankfully, this is a likely rare occurrence with a limited number of likely switches. Regardless of the rarity, an issue was opened to refine the language from “Select Menu” to “Switch Menu” or “Replace”.

In @paaljoachim’s video, he touched on confusion around Styles and how best to both communicate global changes as you’re editing and when you’re saving with multi-entity saving lacking granular options. While there is a welcome guide to help with explaining Styles customization, it very much brings to the forefront how these new concepts will take some getting used to for WordPress users and how much needs to be done in the UIUI UI 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. to clearly communicate what is happening.

Beyond these high level themes, there were some specific issues raised:

I actually missed that I needed to add a name to the color at all. Since there’s no placeholder text in the area where the color name should be added, I completely overlooked it and assumed I would just add the color, click Done, and voilà! However, it looks like not adding a color name at all means the colors won’t get saved. Adding some directive placeholder text next to the colors – or even an error message after clicking Done – might have helped me move past that. 

@evarlese in this comment.

After applying the template to my post, it didn’t look like those changes or settings were applied, since everything appeared at max width, and I wasn’t really sure of how or where to fix that.

@evarlese in this comment.

I found it a bit strange adding a featured image block and a duotone filterFilter Filters 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. without seeing what the result would look like.  

@paaljoachim in this comment. 

Adding a suggest a second button, is showing it is not using the format of the already present one, which should be more logical. The differences are in the “Border Radius: 50%”” and “Width settings: 50%”” not applied on the new one. Of course this is not an issue, and if you need the same button its easy to achieve this duplicating the existing one.

@paulbigai in this comment

The biggest issue I hit was with the Group block. By default, the Twenty Twenty-Two theme adds an 8rem (that’s pretty big) bottom margin to one of the Groups within the header area.

@greenshady in this WP Tavern post.

#fse-outreach-program, #fse-testing-summary

Week in Test – 1 Nov 2021

Welcome to this week’s edition of Week in Test! This post is a curated list of where you can get involved (i.e. where testers of all skill levels and expertise are needed), learning opportunities, and some reading to keep you informed.

This week focuses on helping with 5.9 new features and enhancements. Remember, feature freeze is 9 Nov.

🙋‍♀️ 🙋 Contributing: Tester Help Needed

Looking for ways to contribute? The following tickets and patches need contributors.

Manual testing help needed

Who? All contributors (not just developers) who can set up a local testing environment, apply patches, and test per the testing instructions.

The following tickets need testers to manual test and provide feedback (test report):

PHPUnit tests help needed

Who? Any QA or PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. http://php.net/manual/en/intro-whatis.php. developer contributors who can (or is interested in learning how to) build automated PHPUnit tests.

The following tickets need PHPUnit tests build:

  • #15145: Add a wp_list_users() template tag
  • #54331: Add a hook in wp_http_validate_url to control which ports are allowed for remote requests

Reproducing reported issue help needed:

Who? Any contributor.

The following new tickets need testers to attempt reproducing the reported issue and then providing a test report with the results:

  • #54320: There are no more thumbnails for updated PDFs
  • #54430: Twenty Twenty-One: Menu item focus background only works on Chrome (ignored on Safari)
  • #54354: open_basedir warnings on classic post edit screens with TinyMCE plugins present

Reading / Watching

Meetings This Week

  • 2 Nov 2021: Test Triage session starting at 13:00 UTC
  • 5 Nov 2021: Test Scrub starting at 13:15 UTC

Props to @boniu91 for peer review.

#build-test-tools, #core-test

Overview of the 5.9 Test Leads’ Approach

In preparation for WordPress 5.9 and after accepting Test Lead roles, @boniu91 and I got on the same page about how we plan to support this release. What follows is an overview of our approach. Feedback is always welcome, especially since we’re early enough in the release process to ensure we’re as high impact as possible. The hope in sharing this information is to both set expectations with the overall release team and to establish an early track record that can be used to enhance documentation for this role.

Goals: 

At a high level, the goal of this role is to ensure, through testing, that the next WordPress release delights users with stability and a bug free experience.  More specifically, this can be broken down into the following goals: 

  • Coordinate and lead testing efforts for a major releaseMajor Release A set of releases or versions having the same major version number may be collectively referred to as “X.Y” -- for example version 5.2.x to refer to versions 5.2, 5.2.1, and all other versions in the 5.2. (five dot two dot) branch of that software. Major Releases often are the introduction of new major features and functionality. in order to ensure a smoother release.
  • Increase testing efforts and capacity.
  • Ensure tickets needing testing are properly handled and escalated.

Responsibilities: 

  • Continued calls for testing for the FSE outreach program.
  • A round up of how to best help test for the program/anyone who wants to test for 5.9. Previous example here
  • Help ensure any necessary testing for 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/ specific items, like the Gallery 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. refactor.
  • Amplify testing efforts and opportunities, including helping onboard folks who are interested in helping. 
  • Attend and wrangle meetings (Tuesday triage + biweekly meetings, Friday testing). 
  • Monitor Trac for incoming reports.
  • Test as much as possible throughout the release cycle. 
  • E2e test development (TBD with @justinahinon leading efforts there). 

The above is already underway and will continue through the release cycle.

#5-9

Hallway Hangout: 5.9 Go/No Go, Site Editor IA, and more

This is a summary of a Hallway Hangout that was wrangled in the #fse-outreach-experiment channel as part of the FSE Outreach Program. 

As a reminder, there’s one week left to share your questions about FSE.

Attendance:

Thank you to everyone who took time out of their lives to attend. It’s always lovely to see your faces and have time to chat. @overclokk @karmatosed @get_dave @annezazu @asilver @fabiankaegy @kafleg @mburridge

Video Recording:

Topics Covered:

We mainly focused on three items: the Go/No Go recap, the Site Editing IA concepts, and the Navigation Editor & Block work.

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 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 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 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. 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.

#fse-hallway-hangout, #fse-outreach-program