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.
Please drop by any time in SlackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. with questions or to help out.
Tag Archives: fse-outreach-program
Pooja Derashri
11:29 am on February 5, 2024 Tags: fse-outreach-program
Hello and welcome to another edition of Week in Test, the place where contributors of any skill level can find opportunities to contribute to WordPress through testing. You can find the Test Team in #core-test.
Calls for Testing can originate from any team, from themes to mobile apps to feature plugins. The following posts highlight features and releases that need special attention:
Did you get a chance to look at the Design Share: Jan 15 – Jan 26 post? All features are already available in Gutenberg 17.6 and it would be great if site builders could test them before they land in WordPress 6.5
Improved Lightbox 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. – The lightbox toggle is now part of the link settings for the images, as it’s somewhat a link to the resized view and links and lightbox a mutually exclusive.
Cover Aspect Ratio – Applied to the Cover 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. in various forms.
Drag & Drop Displacement for moving blocks in the List view
Scrolling Top Toolbar is an interesting solution to the problem that we run out of real estate for everything to be placed in the Toolbar when tagged to the top.
Here’s a roundup of active tickets that are ready for testing contributions.
Did you know that contributions with the Test Team are also a fantastic way to level up your WordPress knowledge and skill? Dive in to contribute, and gain coveted props 😎 for a coming release.
Reproduction Testing 🔁
Who? Any contributor. Why? It is helpful to show an issue exists for other users in order to move a ticket forward for patching.
The following new tickets are awaiting review, and need testers to attempt to reproduce the reported issue (aka “repro”), and then provide a reproduction test report with the results:
Who? All contributors (not just developers) who can set up a local testing environment. Why? It is necessary to apply proposed patches and test per the testing instructions in order to validate that a patch fixes the issue.
The following tickets have been reviewed and a patch provided, and need testers to apply the patch and manually test, then provide feedback through a patch test report:
Who? Any QA or PHPPHPPHP (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. https://www.php.net/manual/en/preface.php. developer contributors who can (or are interested in learning how to) build automated PHPUnit tests. Why?Automated tests improve the software development feedback 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. for quality and backward compatibility.
Hello and welcome to another edition of Week in Test, the place where contributors of any skill level can find opportunities to contribute to WordPress through testing. You can find the Test Team in #core-test.
Calls for Testing can originate from any team, from themes to mobile apps to feature plugins. The following posts highlight features and releases that need special attention:
Here’s a roundup of active tickets that are ready for testing contributions.
Did you know that contributions with the Test Team are also a fantastic way to level up your WordPress knowledge and skill? Dive in to contribute, and gain coveted props 😎 for a coming release.
Reproduction Testing 🔁
Who? Any contributor. Why? It is helpful to show an issue exists for other users in order to move a ticket forward for patching.
The following new tickets are awaiting review, and need testers to attempt to reproduce the reported issue (aka “repro”), and then provide a reproduction test report with the results:
Who? All contributors (not just developers) who can set up a local testing environment. Why? It is necessary to apply proposed patches and test per the testing instructions in order to validate that a patch fixes the issue.
The following tickets have been reviewed and a patch provided, and need testers to apply the patch and manually test, then provide feedback through a patch test report:
Who? Any QA or PHPPHPPHP (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. https://www.php.net/manual/en/preface.php. developer contributors who can (or are interested in learning how to) build automated PHPUnit tests. Why?Automated tests improve the software development feedback 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. for quality and backward compatibility.
Pattern overrides: work is ready to test starting with making paragraph blocks overrideable. Up next, headings, buttons and images are expected to be added soon as blocks that can have overrides.
Core-editor improvement – revisions in the site editor. This is a useful post for understanding some of the changes and new features to current revision functionality in the Site Editor aimed for 6.5 and the wider work in this area.
Editor: Important milestones for WordPress 6.5 – useful post for contributors working or wishing to support the 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/ repository with the scheduled 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. 1 for WordPress 6.5 scheduled for February 13, 2024.
Upcoming Meetings 🗓
🚨 There will be regular #core-test meetings held for 2024.
This post is a summary of the Final Touches call for testing for the FSE outreach program, the twenty-sixth and final effort. As always, I want to highlight those who helped to bring others along with them in this latest effort:
InstaWP for allowing the outreach program to use their tooling for free, enabling more folks to jump into this call for testing and for more creativity in what we are able to test.
This testing call spanned numerous planned WordPress 6.4 features, including a focus on the Font Library (which is no longer planned for 6.4). Most feedback pertained to feature requests and usability concerns, highlighting the following common themes:
A desire for improved visibility of current and CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. categories in pattern creation.
Requesting additional controls, similar to the Cover 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., for adding background images to a Group block.
A need for more informative error messages in the Font Library, especially when deleting fonts.
Enhancing the discoverability of the Font Library.
Instead of breaking down feedback into bugs, feature requests, and general usability feedback, everything is broken down into groupings of features with extra quotes. This decision was driven by the limited volume of feedback received (only three responses) and the evident recurring themes within the feedback itself.
Command Palette
The Command Palette was featured throughout this call for testing, including to navigate to a page with a similar name to a pattern. This quickly reinforced a need for more context when searching for items and running commands:
Using the Command Palette. I write Portfolio and get up two Portfolios that have two different icons. One that looks like a post/page and the other as if it is a template part. Hovering over both it would be nice if it said something like: Portfolio page and the other Portfolio template part. To strengthen the meaning of the icons I see. @paaljoachim in this comment.
It would be awesome to have more information about the current state of a toggle, “Disable distraction free mode” instead of “Toggle distraction free mode.” Or maybe make the icon of the active toggle reflect its state by adding a black background like the Settings or Styles buttons do. @josvelasco in this comment.
I like that the command palette now includes site editor navigation like list view toggle, distraction free toggle, and code view toggle. However, I agree with you and the folks here that suggest that the command name having a clearer context of what each will do. @franz00 in this comment.
Patterns
While adding categories to patterns works, the ability to see current categories, core provided or otherwise, would make it much easier to stay organized:
When creating synced patterns, it is great that now we can put them into categories. However, I’ve also learned that WordPress has its own default categories for patterns from this URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.orghttps://github.com/WordPress/gutenberg/blob/c20350c1d246163201375f090b0b7b4ab49b1dad/packages/block-editor/src/components/inserter/block-patterns-tab.js#L35 (‘custom’, ‘featured’, ‘posts’, ‘text’, ‘gallery’, ‘call-to-action’, ‘banner’, ‘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.’, ‘footer’). Personally, I want my patterns organization to be as much closer to WP default categories as possible, but I can’t find those predefined categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. names being listed somewhere in the Site Editor interface. Perhaps we could have categories checkbox for those, like the post page have? @franz00 in this comment.
Since there was a pattern called “Portfolio,” it was kind of confusing to find where to edit the page with the same name. The command palette would be more verbose and say “Edit template Portfolio” instead of just “Portfolio.” @josvelasco in this comment.
I see that I can add a category, but I can not see which categories already exist. As I might want to place this into a pre existing category. @paaljoachim in this comment.
Font Library
The following specific items were raised with a particular note around the need for better error messaging both when uploading and deleting fonts:
I clicked the “Aa” icon to open up font management just because I followed your instructions, but I couldn’t have found the font management easily without them. I love icons, but this is only visible with a label. @josvelasco in this comment.
I tried to upload a .zip on purpose but got no errors. It may be nice to have or suggest allowed font formats and a confirmation notification when one gets uploaded. @josvelasco in this comment.
However, I found that the activation/deactivation and deletion of fonts somewhat confusing. Why would fonts deletion be offered on active, check marked, fonts? Would it make more sense to only offer fonts deletion to the inactive (unused) ones? Because deleting an active font directly impact the pages that use them, which will cause the page to automatically fall back to the default font. Besides, this is done without any warnings. @franz00 in this comment.
I see the Fuggles uploaded above the Theme Fonts. There is a heading for Theme fonts but no heading for the fonts above it. It would be nice to have an “External Fonts” etc heading for the ones that are not Theme fonts. @paaljoachim in this comment.
Other
Of the following items, the desire for more controls in adding a background image to the Group block was mentioned by all three responses. In particular, folks wanted to see the ability to change focal point.
I find the rename feature taking too many steps and feels cumbersome. I would like to double click it just as if I was on a Mac to rename. I am happy the feature is in even if it kinda feels half baked. @paaljoachim in this comment.
Color adjustments are fine, but having the same background adjustments available as the cover block would be great. Focus point, at least. @josvelasco in this comment.
I also noticed that when navigating blocks in list view, the up arrow key sometimes cannot traverse back up when it encounters synced patterns, or a footer template part. @franz00 in this comment.
Get ready for the next big release in the WordPress world! WordPress 6.4 is set to launch on November 7, 2023, and we need your help to make sure it’s the best it can be. With exciting new features and improvements, this release promises to be a game-changer for WordPress users everywhere.
Please only test on a development siteDevelopment SiteYou can keep a copy of your live site in a separate environment. Maintaining a development site is a good practice that can let you make any changes and test them without affecting the live/production environment. and not on a production/live site. You can follow these instructions to set up a local installLocal InstallA local install of WordPress is a way to create a staging environment by installing a LAMP or LEMP stack on your local computer. or use a tool like this to set up a development site.
Once your development site is set up, please install and activate the WordPress Beta Tester Plugin. After activation:
Navigate to Tools > 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. Testing.
Set the update channel to “Bleeding Edge” and click Save Changes.
Set the stream option to “Beta/RCRelease CandidateA beta version of software with the potential to be a final product, which is ready to release unless significant bugs emerge. only” and click Save Changes again.
Navigate to Dashboard > Updates and click the Update to latest… button.
At a high level, here are a few tips to keep in mind to get the most out of helping to test:
Test across different browsers.
Test in different languages.
Compare features on different screen sizes, including tablets and mobile.
Use just your keyboard to navigate, or use a screen reader.
Test with both 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 classic themes.
Key Features to Test 🔑
Style
Global Styles RevisionsRevisionsThe WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision.
This release introduced a handy feature that allows you to reset global styles back to their default settings with ease (52965). With this enhancement, you can effortlessly reset any changes made to global styles back to their original state. To try out this feature, simply make a few revisions to the global style and then open the revision panel. You’ll see a list of all the revisions, and at the bottom, there’s an option called “Reset to Default.” Click on it to return to the original settings. Now, you only need to go through one revision check instead of two (53281). Previously, the revision panel was only available after two styles of revisions were saved in the database.
Please help test global style revisions with this video to guide you:
Twenty Twenty-Four Default Block Theme
Twenty Twenty-Four default theme is set to launch in 6.4. The theme for the year 2024 will use new design tools to make websites look better and be easier to edit. It will have special designs for three groups of people: entrepreneurs and small businesses, photographers and artists, and writers and bloggers. Here, you can find Related Gutenberg Issues and PRs.
Please help test the default Twenty Twenty-Four theme, this is the demo video:
Interface
Write with Ease
In this release, ongoing efforts are being made to ensure a smooth and enjoyable writing experience in WordPress(#53305). These enhancements include the addition of new keyboard shortcuts and improvements in copying and pasting text from other sources. The Link preview feature (53566) now includes a convenient “Open in new tab” control, making it simpler to enable or disable this option. Additionally, toolbars for List, Quote, and Navigation blocks have been enhanced to make your writing and editing process more efficient.(#53699, #53697). Please help test using keyboard shortcuts and copying and testing text from other sources.
Please help test the improved writing experience for list items with this video to guide you:
Please help test the capture toolbar in the quote block with this video to guide you:
Please help test the ‘Open in New Tab’ feature with this video to guide you:
Improvements to List View
The List View in WordPress has undergone some great enhancements. Now, managing your content is even more straightforward and user-friendly. You can easily rename Group blocks using a handy options menu that pops up. When dealing with gallery and image blocks, you can now see previews of your media to make sure everything looks just right. Additionally, resizing and duplicating blocks have become much more efficient, with keyboard shortcuts available for quick actions. The List View now allows theescape key to deselect blocks if blocks are selected(48708). These improvements in the List View make organizing and editing your content in WordPress a breeze.
This video is showcasing the use Escape to deselect blocks feature:
Please help test by renaming group blocks in the list view with this video guide:
This image showcases a media preview for the gallery and image blocks:
Please help test by using keyboard shortcuts for duplicating blocks with this video to guide you:
Improvements to the Command Palette
The Command Palette has undergone several changes and improvements since its first introduction in WordPress 6.3. For example, you can now do more with blocks using new commands, including block transforms and the options to duplicate, copy, remove, and insert after/before. The Command Palette also looks different with a fresh design. Plus, it now supports adding commands without icons. If you’re using WordPress on a small screen, like a mobile phone, the Command Palette will work better for you. It also uses more consistent language and actions, making it easier to use. Lastly, there are improvements in snackbar motion, making your experience smoother. These changes make managing your WordPress site even easier and more user-friendly.
Please help test adding blocks by commands and registering commands without icons with this video to guide you:
This image shows you registering commands without icons.
This video is showing some improvement for the command palette on smaller screens:
Test with tweak and add more consistent commands:
This video displays snackbar motion, and you can test this feature by similarly giving commands.
Please check out more improvements to the recent updates made to the Command Palette.
Blocks
Block HooksHooksIn WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same. (Previously Auto-inserting Blocks)
Introducing the Block Hooks feature, a reimagined approach to the earlier concept of Auto-inserting Blocks. Basically, Block Hooks is an APIAPIAn API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. that developers can use to make websites more flexible. It allows one block to attach itself to another block and show its content before or after that block. You can also attach a block to a parent block and make it appear at the beginning or end of the list of child blocks inside it. (53987)
Even though Block Hooks is mainly for developers, it also gives a nice experience to the end users by automatically inserting a block into a specific location. It lets developers place blocks where they want them to be and gives room for customization. The goal is to make block themes more adaptable with the help of plugins.
One thing to keep in mind is that the block using this API will only be auto-inserted if the original template or part hasn’t been changed by the user. This is done to respect the user’s choice. This API can only be applied with block patterns, template parts, and templates that come from the block theme files. It doesn’t alter anything the user has already created or changed on a website.
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 Pagination Enhancements
Now, you no longer need a full page reload when you navigate between pages in a Query Loop block. There’s a new setting that prevents full page reloads. This improved way of moving between pages is made possible by a special version of the Interactivity API, and it makes browsing smoother. Plus, you can also decide how many pages you want to show using the Query Page Numbers block for even more control.Query block: Client-side pagination (53812), make mid-size parameter settable for Query Pagination block. (#51216).
Please help test adding pagination in your query block. This video guides you through the pagination in the query block.
Client Side Pagination
List Block Enhancement
In the List Block, a new feature has been introduced that allows you to merge consecutive lists instead of keeping them as individual blocks. This enhancement streamlines your editing experience by combining lists that appear one after another, making it easier to manage and format your content seamlessly. (52995)
Group Block Enhancements
Now, you can easily rename Group blocks to organize your content better (53735). This feature makes it simpler to identify and manage different sections of your page, streamlining your editing experience. Additionally, the introduction of background images for Group blocks brings more creativity and customization to your layouts. These enhancements empower you to create more organized and visually appealing content in WordPress. (53934)
Background image support to the Group block
Please help test by renaming the group blocks using this video guide.
Add Aspect Ratio to the Image Block’s placeholder
Aspect ratio controls to the 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. block were introduced in the 6.3 version, and now, these helpful controls have been extended to the placeholder of the Image block. This enhancement offers greater flexibility, particularly when designing wireframe-style patterns that establish a layout for users to fill in with their content.
Navigation Block Enhancements
You can select the default coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress./navigation-link variant within the core/navigation block, offering more flexibility and customization options for your navigation menus (50982)
Please test by adding navigation block and start customizing it with this video to guide you.
Add Lightbox Functionality for your Images
WordPress 6.4 introduces an improvement to the image experience with the new Image Lightbox feature. Recognizing the need for clarity in the user interface (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.), a dedicated Settings panel has been instituted for the image block. Within this panel, users can easily locate the Lightbox toggle, available both in Global Styles and Block settings.Display your pictures in an engaging way using the brand-new lightbox functionality. This cool feature will work with image blocks, so you can click on an image and see it in a bigger size right on top of your existing content. (51132)
General Block Improvements
Preformatted: Add margin and padding support. (45196)
Footnotes: Add link, background, and text color support (52897).
Footnotes: Add typography, dimensions, and border block supports (53044).
Patterns
Create your own Pattern Categories
Now, you can neatly group your patterns by categories when you create them. These categories are handy because you can use them to organize and find your patterns easily. You can also edit these categories in 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. when you’re editing a pattern.
To ensure this feature functions smoothly, here are the steps to follow: Begin by adding various user patterns, both synced and unsynced, assigning categories to each (remember to hit ‘enter’ or add a ‘,’ after each categoryCategoryThe 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging.). Then, navigate to the site editor patterns page and verify that the categories appear in the left navigation panel. Confirm that selecting a category displays the corresponding patterns accurately and that theme patterns continue to appear as expected. Check that all patterns are accessible under ‘All Patterns’ and that the search function operates seamlessly. Lastly, duplicate a theme pattern and ensure that the new pattern inherits the same category. Additionally, when adding a user pattern with the ‘Footer’ category, make sure it displays alongside the theme Footer patterns, taking into account the category slug distinction (theme patterns use ‘footer’ while the user category name should match this). To make things even simpler, all patterns, whether they’re synced or not, are listed together in one place. There’s no need to look in different tabs for synced patterns; they’re all in the same section. (53837)
Please help test creating categories, adding synced and unsynced patterns, and assign them categories with this video to guide you:
Import/Export Patterns as 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. files.
To maintain compatibility with Reusable blocks, you can now import and export patterns as JSON files, providing a straightforward way to transfer custom patterns between websites. (54337)
Please help test import and export patterns with this video to guide you:
When I was the only one in attendance, I decided to still record an update on both WordPress 6.4 and the FSE Outreach Program. To do so, I went through the Evolving the FSE Outreach Program post and went through various top 6.4 related items. Anything starred is not yet merged:
Introducing new design tools (more 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. supports, background image for group block, aspect ratio on image placeholder, add block instance elements support for buttons and headings)
Introducing Block Hooks with a mechanism for more finetune control post 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. 1.
This post is a summary of the Momery Makeover call for testing for the FSE outreach program, the twenty-fourth effort. As always, I want to highlight those who helped to bring others along with them in this latest effort:
InstaWP for allowing the outreach program to use their tooling for free, enabling more folks to jump into this call for testing and for more creativity in what we are able to test.
Thank you to @bph and @ndiego for covering for two weeks of this call for testing when I was out on vacation. Your coverage made my break possible!
High level summary
Since this call for testing took place during the early stages of an iterative process, several aspects of the feedback provided have already been swiftly addressed, thanks to ongoing development for WordPress 6.3. The relatively limited amount of bugs received and feedback aligning with feature development reflects a level of solidness in the direction of recent improvements. These improvements encompassed a range of features, such as the ability to rename menus in Site View, add template parts directly from the Site View, publish pages, and introduce additional interface enhancements to improve the template vs content editing experience. Notably, Style RevisionsRevisionsThe WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision. proved to be significantly more intuitive compared to the code view available for Templates and Template Parts.
@paaljoachim shared a video of his experience going through the call for testing if you’re looking to get a sense of a test contributor’s experience in more detail:
Bugs
The following bugs were all reported before this call for testing, reflecting known issues and showing a level of stability in the breadth of new features added to the Site Editor experience:
Right now we can use a 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. or Post Content. Post Content is the whole entire post in the Editor, but the post up to the “More 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.” on the front end. This is the behavior that I expect on the front end. But I would really like the Editor to not show the entire post! It just makes the Queries too long.
When I created a new page by way of creating a draft page. I found that a draft page creation option was missing if I tried to create it under the Menu 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.https://s.id/1Nh2y. However, it showed up if I tried to add a non-existent page link via the Navigation block https://s.id/1NgZg.
Many of the feature requests tie in nicely with work either completed or currently underway (marked as “In the 6.3 board”). Across most of the following issues, the ability to access exactly what one wants in the Site Editor as a whole acts as a through point, whether when clicking “Edit Site” from the admin bar or trying to search for specific things with the Command Palette. Building into phase 3, the Template Part and Template revisions were seen as subpar in comparison to the new experience offered by Style revisions.
I went out of the site editor and found the blog page in the Pages screen. Viewed it. Then clicked Edit Site. I expected to have the Home template open up but instead clicking Edit Site on the frontend will only open the Front Page template, and not the template related to the specific page I am on.
I feel uncomfortable to roll-back template changes using the provided revision states located at the bottom of a particular template tab. The reason for this discomfort is that the revision states appear to be too raw. Since we rarely used the Code editor in building a site/pages in the Site Editor, seeing loads of HTMLHTMLHTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. block codes as reference points to roll back to feels unfamiliar within our current workflow.
I had to go to the side menu to change the Page template why from the About page I didn’t see the option to Edit the template page. I found the option when I changed to Contact page by chance. The solution? I don’t know which is the better option. Maybe that open right side bar by default when we change a page or template. Or open and close to see that this appears here. Or in the wizard (I don’t saw the wizard).
When typing in ‘page’ into the command centre – I didn’t expect ‘add new page’ to be the first item – rather than the ‘page’ template. Is this weighted in some way? It may just be me.
Part of the call for testing instructions included replacing a template part and creating a new menu, both of which caused some confusion. Each experience has improved with additional functionality added to the Site View for each respective section (Patterns, Menus). Outside of that, it’s worth noting that with Reusable blocks being consolidated into Patterns overall, a bug with Reusable blocks now has a wider spread impact. Currently, if you convert a set of blocks into a Pattern, the align full or align wide options are removed, leading to what feels like a broken experience by design since the alignment/flex position depends on the container. This is likely to come up as a broader piece of feedback. The Navigation block continues to receive feedback around the desire to have an easier and more consistent way to rename, regardless of where you are editing a menu (sidebar, in editor, in Site View).
Desire for simplified dimension controls for Columns block.
Finally, a few folks mentioned issues with the Post Content block that wasn’t replicable in later versions released after the call for testing.
I think creating a reusable block or a template part from the Site editor should be possible. People using the Site editor probably will know the difference. I like the idea of making things clear, but I’m not 100% convinced. I prefer to have a place to be able to edit everything, including content, and the other just for content.
I first tried to “Replace the Footer”, and while it added a new footer in the Home Template, it had a different name in the Library > Manage All Template Parts. It didn’t change the existing Footer into the new one which was what I expected from “Replace Footer”. Later I realized that this did exactly what it was supposed to do – create a new Footer to use.
Create a reusable block. NB! Before creating a Reusable block I had a full width block. After the conversion to a Reusable block the alignment controls went away and it seems that the block went to a no alignment. How do I have the Reusable block in full width alignment?
When I go to add three columns with the Columns block, I have the option to give the gap space between columns and I have the padding default left and right padding in each column. I am confused. I think that if I have gap option, should not have padding or reverse.
When searching for pages in the command centre – there was a slight delay before they showed as results – but there was no visual indicator that anything was happening.
Get ready for the next big release in the WordPress world! WordPress 6.3 is set to launch on August 8, 2023. Every major releaseMajor ReleaseA 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. comes with exciting new features and improvements, and we need your help to make sure it’s the best it can be!
This is the first Call for Testing post for the 6.3 release. Be on the lookout 👀 for future posts that highlight additional enhancements in the release.
Please only test on a development siteDevelopment SiteYou can keep a copy of your live site in a separate environment. Maintaining a development site is a good practice that can let you make any changes and test them without affecting the live/production environment. and not on a production/live site. You can follow these instructions to set up a local installLocal InstallA local install of WordPress is a way to create a staging environment by installing a LAMP or LEMP stack on your local computer. or use a tool like this to set up a development site.
Once your development site is set up, please install and activate the WordPress Beta Tester Plugin. After activation:
Navigate to Tools > 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. Testing.
Set the update channel to “Bleeding edge” and click Save Changes.
Set the stream option to “Beta/RCRelease CandidateA beta version of software with the potential to be a final product, which is ready to release unless significant bugs emerge. only” and click Save Changes again.
Navigate to Dashboard > Updates and click the Update to latest… button.
At a high level, here are a few tips to keep in mind to get the most out of helping to test:
Test across different browsers.
Test in different languages.
Compare features on different screen sizes, including tablets and mobile.
Use just your keyboard to navigate, or use a screen reader.
Test with both 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 classic themes.
Key Features to Test 🔑
Interface
Command Palette
The new Command Palette (formerly “Command Center”) allows users to quickly navigate to specific pages, templates, or template parts, as well as offers an easy way to start to create new content in the site editor. From within the editor just use Cmd-k (macOS) or Ctrl-k (Windows) and start typing for a context-aware selection of commands and shortcuts. (49330)
Extenders can also find information on creating custom static, dynamic, and context-aware commands with this feature’s public API. (51169)
Improved Page Management
The site editor now allows site builders to manage pages, edit content, access page details, and even draft new pages to be published later. Look for the new Pages menu from Appearance > Editor. (50857, 50767, 50565, 47142)
Content Editing in Site Editor
This feature allows site authors to seamlessly switch between template and page content editing within the site editor. 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. improvements also highlight what’s being edited – template or content – and allow for a more efficient workflow when building out a site. (44461, 50857)
Distraction Free Mode in Site Editor
Distraction Free mode, previously available in only the post and page editor, now brings the calmness to the site editor, offering a 1:1 preview to site authors. (51173)
Block Theme Preview
Previews of block themes now launch in the site editor, providing efficient previews of locally-installed themes. To see this feature in action, navigate to Appearance > Themes and click “Live Preview” on any block-based theme.
This feature can also be accessed by appending the following to a site editor or frontend URLURLA specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org: ?wp_theme_preview=theme-slug where theme-slug is a locally installed theme to preview (e.g. twentytwentytwo). (50030, Trac 58561)
Using the Style Book in the Styles’ Site View
The Style Book can now be activated while browsing global style options for easier visualization of effects on various page elements. (50566, 50393)
Styles RevisionsRevisionsThe WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision.
This update introduces support for global style revisions in the site editor, providing the ability to review or roll back to a previous state. (50089)
Top Toolbar Improvements
The editor’s “Top toolbar” has been refined with better handling of the limited space in this area, and better accounts for browser viewport width limitations. (40450, 49634)
Blocks
Time to Read Block
This feature has been moved to a future version of WordPress so that it may undergo additional testing before release.
The new Time to Read block allows you to display the estimated time the average reader takes to read the current page or post. Letting readers know right off what their estimated reading time is helps them to decide if they should continue reading, or save the post for later.
Begin by adding the block from the block picker, or from an empty Paragraph block starting with the forward-slash (“/”) key, and start typing the block name: /time to read. (43403)
Details Block
WordPress now introduces the versatile Details block, offering a seamless way to toggle the visibility of content, such as very long text, code samples, or spoilers. This block comes with two new inner blocks: Details Summary and Details Content. The summary is always visible, and the content is collapsable to be shown or hidden when readers toggle it.
Add the Details block through the block picker, or from an empty Paragraph block starting with the forward-slash (“/”) key, and start typing the block name: /details. (45055)
Color and layout support for the Cover block
The Cover block now supports the text color design tool. The enhancement makes it easier for users and theme authors to customize the color for all inner blocks with a single setting. Along with this benefit, this change makes it easier to handle transforms from the Media & Text block. (41572)
Footnotes
The new Footnotes block is a powerful addition that automatically links and formats footnotes, allowing users to work efficiently while annotating content. Not an insertable block per se, Footnotes are activated by highlighting text in a block, and then in the context menu selecting More > Footnote. (51201)
Caption Styling
Theme authors can now create custom styles for Caption elements directly via theme.json. Once added, options become available in the Styles interface, and allow creators and users to customize captions without touching code. (49141)
Image Aspect Ratios
Adding a powerful feature to the Image Block that makes usage of this block much easier. Until now, to effectively replace one image with another, their size had to be the same. The image aspect ratio section solves this problem completely. New image size controller that comes with aspect ratio, scale, width, and height options. (51138, 51545)
Patterns
More Curated Patterns
The new “Curated” filter in the pattern directory helps users differentiate between CoreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress.-bundled and community contributed patterns.
Easier Pattern Creation
Effortlessly design and save patterns, just like the convenient reusable blocks you’re familiar with. Now you can easily create and save your favorite patterns as synced or unsynced patterns, saving you time and effort when designing your projects. You can find your saved patterns under Custom Patterns. (46248)
WP Briefing: Episode 54: A Bill of Rights for the Open Web: Dig into the four freedoms of open sourceOpen SourceOpen 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. and how they relate to WordPress’s idea of a “Bill of Rights” for the open web.
Status update on the SQLite project: Learn more about how to test and provide feedback for this proposal to eventually offer SQLite support natively in WordPress coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress..
@ironprogrammer invited/reminded the team to consider submitting topics and/or applying to the 2023 WordPress Community Summit, emphasizing that ideas and input from underrepresented community members is especially important to summit discussions.
While the release of 6.2 brought loads of new features to the site editing experience, feature development has continued in the 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/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, leaving us with the next lineup of cutting edge features to test and refine. This includes looping back on the new navigation section that was removed for WordPress 6.2. The aim of this call for testing is to both get feedback on what’s landed in 6.2 in the pursuit of continuous iteration and to dig into what’s being worked on for the remainder of phase 2 items including:
As always, these calls for testing will also explore current features that have been staples since the beginning of the introduction of the site editor, like the Navigation 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. or Template Part blocks.
Framing
You run a site that captures “Daily Delights” about the power of everyday moments to create joy. You want to create a new front page of your site that’s more colorful to reflect the nature of your content. When you chose your theme, you knew it came with a few front page options thanks to patterns so you decided to check out what’s possible. Once you have a new front page option in place, you decide to make some additional changes to your template and navigation to better personalize this new experience of your site.
Please do not repeatedly open this link as it creates a new site each time and there’s a limit of 50 sites that can be created.
This will launch a site for you to use for up to 24 hours. Select “Magic Login” to log in to the wp-admin dashboard.
Save the link to your site so you can access it again during the test.
To set up your own test site:
Have a test site using the latest version of WordPress. It’s important this is not a production/live site.
Install and activate the Twenty Twenty Three One by going to Appearances > Themes.
Install and activate Gutenberg 15.5.1. From there, head to Gutenberg > Experiments and turn on the Grid variation for Group block experiment.
Head to Tools > Import and import this file to have access to the same content as above. From there, create a simple menu and add a few widgets.
If you have any issues with manual setup, just comment on the post or pingPingThe act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.” me (@annezazu) in 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/slackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..
Create a new Front Page
Head to Appearance > Editor and select Templates. Click through a few of the templates to get a feel for your site and notice how a preview is shown of each template when you do so. To go back to view all templates, select the > arrow.
Click the + next to Templates in the dark gray 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. and select “Front Page”.
This will open up a modal where you can choose between different patterns to begin building your template. Select the second pattern with various green colors depicted. This will bring you to the Front Page template with that pattern inserted automatically.
Use the Grid layout
Using List View, select the second Group block that contains 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.
Open the block settings and choose to transform it to a Grid layout. Here’s a visual.
After doing so, under Layout in block settings, change around the values of MINIMUM COLUMN WIDTH until you like how it looks.
Underneath this Group block, add an additional Grid group block variation by either directly searching for “Grid” or adding a Group block and selecting the Grid variation.
Explore using this block. This is intentionally an open ended item to encourage you to explore what this experimental block can do. For example, you could add a section of images or different sections of Headings and paragraph blocks grouped within a Grid block or a section of hashtags you want folks to use. Here’s an example of this last item.
Save changes.
Create a new page (or pages) for navigation
Select the Navigation Block in your 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 select the option to “Edit” converting your menu to individual blocks.
Add a new item to the menu by clicking the + button in the editor itself (not in the settings sidebar).
Instead of adding a current page, search for “Inspiration” and notice the option to create a draft page with that title. Select that option.
Create as many draft pages as you’d like using the same process.
Add a search block to your menu and customize it.
Save changes.
Manage your navigation and explore your pages
Select the WordPress icon to open up the dark gray sidebar and use the > arrows to go back to the overall Design section.
Notice there is now a Navigation section. Select it and rearrange your menu items from there.
Select a page in your menu and notice that you can edit it directly either by clicking on the canvas or selecting the pencil icon in the sidebar. Make changes to this page and don’t save in the editor.
Instead select the WordPress icon to open up the dark gray sidebar and notice a Save option in the sidebar itself.
Select the save option there and select Save again from the modal.
Repeat this process with another page in your menu, saving where you’d like.
When done, go back to wp-admin > Pages and publish your pages to ensure they appear correctly in the navigation of your site.
What to notice:
Did the experience crash at any point?
Did the saving experience work properly?
What did you find particularly confusing or frustrating about the experience?
What did you especially enjoy or appreciate about the experience?
What would have made this experience easier?
Did you find that what you created matched what you saw on your site?
Did it work using Keyboard only?
Did it work using a screen reader?
Did it work while using just a mobile device? Shout out to @nomadskateboarding for this addition!
With WordPress 6.2 released, this exploration seeks to explore the Site Editor as a design tool, asking folks to create 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. theme without any code directly in the editor using the current tools. The aim is to both find gaps in functionality and to get feedback on the experience of using the Site Editor in this design centric way, as we look to expand the number of block themes.
The focus of this exploration is to think with a more open minded, “what can I build today?” approach. If you’ve never built a block theme, consider this an invitation to give it a try. Tooling has come a long way and the power of what’s being built is that it allows more folks to dive into the future (and present) of WordPress.For this experience, you’ll use the Create Block Theme 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 to facilitate the creation and export process so you can keep what you create! Feel free to read these brief instructions for how to get started or follow the steps below.
In the near future, expect a more formal call for testing once more, dedicated to some of the newer functionality being worked on as part of the remaining major phase 2 items.
This will launch a site for you to use for up to 5 days.
Save the link to your site so you can access it again during the test.
To set up your own test site:
Have a test site using the latest version of WordPress. It’s important this is not a production/live site.
Install and activate the Create Block Theme plugin.
Install and activate 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/ 15.4 (or the latest version).
Create the base of your theme
Navigate to Appearance > Create Block Theme.
Choose either “Create blank theme” to start completely from scratch or you can use the currently active block theme by choosing the “Clone” option. Note: You are welcome to use a block theme of your choosing if you Clone!
Fill out the information for either option. Feel free to keep this pretty simple since this is just for testing and not official block theme launching purposes. When done, select “Generate”.
Head to Appearance > Themes and activate the theme you just created.
Configure your fonts
Head to Appearance > Manage Theme Fonts.
From here, you can add a Google font or a Local font if you have any you’d like to use. This will install the fonts (download them) as part of the theme but these fonts still need to be applied.
Once added, you can then manage the font weights.
After you’re done, head to Appearance > Editor and open Styles to configure these fonts for use on your theme under Typography.
Make your changes and export
Head to Appearance > Editor and begin customizing as you’d like!
Here are some high level ideas:
Use the Styles interface to make global changes to the Layout, Typography, and more. Use the Stylebook to see your changes at a glance to individual blocks.
Use the design tools built into each block to make individual changes.
Create new templates or template parts.
Add or remove different blocks from current templates or template parts.
Export your theme
When you’re done making your changes, head to Appearance > Create Block Theme.
From there, choose the “Export” option. This option will automatically include user changes so you don’t have to overwrite them first.
Please share feedback by April 26th, 2023
What to notice
While you’re welcome to share feedback on any aspect of the experience, here are a few specific questions to focus your feedback.
Did the experience crash at any point?
Did the saving experience work properly?
What did you find particularly confusing or frustrating about the experience?
What did you especially enjoy or appreciate about the experience?
What did you need to use Custom CSSCSSCSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. for, if at all?
Was there anything you weren’t able to accomplish that you’d like to see considered?
As always, thank you for participating in this exercise. If anything is blocking you from doing so, just say so either in #fse-outreach-experiment, in the comments of this post, or over DM in slackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. to @annezazu (that’s me!).
You must be logged in to post a comment.