Tag Archives: core-editor

David Smith 11:06 am on August 12, 2021
Tags: core-editor, , ,   

Editor chat summary: 11th August 2021

This post summarises the weekly editor chat meeting (agenda here) held on 2021-08-11 14:00 UTC in Slack. Moderated by @get_dave.

GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party releases

Whats next in Gutenberg: July and August

Updates based on the scope for Site Editing projects

Updates were requested for the key projects:

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

@mkaz provided an update:

Navigation Editor screen

@get_dave provided the update:

  • Work has continued on bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes and stability.
  • Now looking to define what is required to bring the Nav Editor out of “experimental”.
  • To this end, the team is looking to arrange a hallway hangout (or similarly public forum) to compare/contrast the classic navigation screen with the block-based navigation screen.
  • We’re also looking 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 or break down any “Epic” Issues from the Nav Editor tracking issue into more actionable tasks (where possible).
  • @javiarce has also been looking into and documenting the need to add some “polish” to the Nav Editor screen in order that UXUX User experience bugs/issues don’t spoil the overall experience. I believe he will look to add these as Bugs to the repo soon.
  • From this we will then look to reprioritise the task list in this tracking Issue around achieving feature parity at a user interface level (developer APIs will follow).

Block based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor and CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings..

@get_dave provided the update:

Native Mobile Team

@mattchowning provided the update:

Shipped

  • Added Android support for themes that use Global Styles

Added:

In Progress:

  • Block Picker Search is almost ready to ship.
  • Embed block.
  • Editor onboarding help section.
  • GSS Font size.
  • line height.
  • colors.

Styles, Patterns and Template Editor

At the time of the meeting no updates were provided. If you are a contributor, please do leave an update in the comments below.

(Aside: see Open Floor section below where we discussed how to avoid situations where there are no updates for key projects during the meeting).

Bonus: impromptu discussion on “Full Page Patterns”

This item was not on the agenda, but it’s worth including here because some good points were raised about the value of this proposal.

  • @paaljoachim resurfaced the idea of full page patterns as an alternative to creating a page template.
  • There is a proposal to add Full Page Patterns to Core which looks to have stalled.
  • One could tell the user to add a full page pattern instead of a reusable block that needs to first be converted back to regular blocks before being filled out.
  • Adding patterns is an accident proof way of not affecting any other pages. 
  • @mkaz noted that this feature will work now – there is no limit to what can be put into a pattern.
  • @get_dave noted the key difference between Full Page Patterns and Templates is that inserting a pattern is a one time operation – once inserted it will receive no further updates should the pattern be amended in future.
  • @digamberpradhan and Frank Wazeter were both in favour and could see the value of full page patterns as a discreet concept.

Task Coordination

@paaljoachim:

@annezazu:

  • Main focuses this week are:
    • starting to recap the block theme survey (responses due by Friday!).
    • shipping the call for testing today (included lots of testing).
    • responding to feedback as responses roll in.
  • I hope to have time to do triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. once more, focused again on labelling PRs to make releases a bit easier.

@get_dave:

Open Floor

Proposal for improving the “Key project updates” section of editor chat meetings

Usability feedback on the Template settings panel in Block Editor

  • Frank Wazeter raised some feedback about the Template settings panel.
  • When you click on “new”, the default thought is to do something akin to “create new from default template,” especially because the dropdown above has “default” selected.
  • However, what you get is whatever’s set in ‘defaultBlockTemplates’, which for the vast majority, isn’t anything explicitly set.
  • Likewise, if I select another template, my initial assumption is I’m making “New from…” whatever template I set.
  • It might make more sense if there was a toggle – similar to in background color for “Color” or “Gradient” to indicate that I’m making a brand new blank template.
  • @get_dave advised creating and Issue and Frank did so after the meeting.

Wrap up

Thanks to everyone who attended the meeting!

#core-editor, #core-editor-summary, #meeting-notes, #summary

David Smith 9:00 am on August 10, 2021
Tags: , core-editor, ,   

Editor Chat Agenda: 11 August 2021

Facilitator and notetaker: @get_dave.

This is the agenda for the weekly editor chat scheduled for Wednesday, August 11, 2021, 03:00 PM GMT+1.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • Gutenberg 11.2.1 and 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/ 11.3.0 RC.
  • Whats next in Gutenberg: July and August.
  • Updates based on updated scope for site editing projects and WP 5.8:
    • Template editor.
    • Patterns.
    • Styling.
    • Navigation 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. & Navigation Editor.
    • Block based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor.
    • Mobile Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meeting

Jorge Costa 5:57 pm on August 5, 2021
Tags: , , core-editor, , ,   

Editor chat summary: Wednesday, 4 August 2021

This post summarizes the weekly editor chat meeting on Wednesday, 4 August 2021, 14:00 UTC held in Slack.

WordPress 5.8 final release

@jorgefilipecosta congratulated all the people that contribute to the WordPress 5.8 release. Adding that it was a big release that changed multiple things in the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., added part of the FSE engine, implemented blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. widgets between other big additions.

@youknowriad invited people to participate in a retrospective that is happening. And added the following:

One thing I didn’t share on my comment there is that we’ve been on a feature release work for a long time. I’d love if we can focus more on quality related work (polish/performance…). For instance if you worked on a feature on previous releases, what can you do today to make it better in terms of code, performance and maintenability.

What’s new in 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/ 11.2.0

@jorgefilipecosta announced that Gutenberg 11.2 was released before the chat, and asked people to report any regressionregression A software bug that breaks or degrades something that previously worked. Regressions are often treated as critical bugs or blockers. Recent regressions may be given higher priorities. A "3.6 regression" would be a bug in 3.6 that worked as intended in 3.5. found in their tests or if the update did not work as expected.

Project updates

Site Editor

@jorgefilipecosta submitted a PR that proposes a mosaic view one of the goals for July & August. The PE contains most of the functionality proposed in the mockups but not all of it because the PR was already huge. The PR also implemented the logic for an editor modes functionality that will be used to add the code editor in edit site very useful for example to full site editing theme developers.

Navigation block

@mkaz shared that, the Navigation Block is in a good state, still iterating but the next big step is a call for testing in the next week. And asked people to keep an eye out at #fse-outreach-experiment or the make.wordpress.org/test site. The team will collect feedback from that call to define what areas need focus, improving, and further iteration.

Navigation

Widgets

Native mobile application

Available in the next release:

  • “New block” block picker badge for 50% of users to measure performance.
  • Setting the 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. via the Image block directly.
  • Fixed a crash in the column block, and an issue with the “More” menu in the UBE.

In progress

  • Updated the Mobile Gallery Block Refactor (PR) with the changes from Web and merged it.
  • Block Picker Search, Embed block, editor onboarding help section, GSS Font size, line height, colors.

Task coordination

@youknowriad

Is working on performance work. Has a PR improving inserter search performance.
Is also iterating on some layout-related additions. Like the block gap support.
Reviewing the PRs that he can help with.

@joen

Looks forward to getting back to polishing and improving the navigation block, list view, and a ton of other cool things, perhaps even a little framer animation! Is also going to land github.com/WordPress/gutenberg/pull/32659 one of these days, and follow up with what that will mean for the Gallery block.

@gziolo

  • Finished working on adding support for variations in block.json file to WordPress core: As part of the efforts the same patchpatch A special text file that describes changes to code, by identifying the files and lines which are added, removed, and altered. It may also be referred to as a diff. A patch can be applied to a codebase for testing. proposes a unified way to apply translations to block.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. and theme.json.
  • Finished working (together with @jsnajdr and @walbo) on webpack upgrade from v4 to v5 in the build tooling: It would be great to have a wider testing before the team lands it as it impacts Gutenberg, Storybook and all projects that use wordpress/scripts.

@get_dave

Mainly working with @joen on adding a Text field to the Link UI to improve the UX around adding links (mainly in the Nav Editor). Also taking a look at pattern-based solutions to some Widgets screen markup backwards compatibility problems. Starting to think about Navigation Editor and theme.json again.

@jorgefilipecosta

His objectives for the week are:

  • Address feedback and merge the mosaic view PR
  • Propose a follow up PR with the remaining mosaic functionality.
  • Propose a PR with the code editor view on the site editor.
  • Investigate and improve the performance of the site editor.
  • Submit some site editor bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes and code quality/APIAPI An 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. improvements.
  • Review the locking improvement proposal.

Open floor

Alignments in the shortcodeShortcode A shortcode is a placeholder used within a WordPress post, page, or widget to insert a form or function generated by a plugin in a specific location on your site. block

@paaljoachim share the following:

The Shortcode block does not have alignment or a way to add a custom CSSCSS Cascading Style Sheets.. Here is a conversation in slackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. which would be helpful to take a closer look at: https://wordpress.slack.com/archives/C02QB2JS7/p1627590018095900

Adding that he is hoping that we can improve the shortcode block, as it is very limited in functionality.

@jorgefilipecosta said that for this use case the shortcode should be nested inside a group block.

@paaljoachim added that the shortcode is not working well inside the group block and as a follow up is going to open an issue so the team can investigate this further. The issue was created after the chat.

Wassim Boussebha new contributor presentation

Wassim Boussebha introduced himself to the participants of the chat:

I am Wassim Boussebha 18 years old,  computer science student in first year , I am interested to contribute to gutenberg project and be one of the maintainers in the future, currently I am learning computer science basics and foundations including algorithms, computer operating systems,databases….

Adding that he would like to know what is the specific tech stack that would allow him to contribute and work on this project and if it would be possible to provide some orientation.

@jorgefilipecosta thanked Wassim Boussebha for the interest in contributing. And together with @paaljoachim shared links to some tutorials, explained the tech stack, and referred what could be the first issues Wassim can work on. @jorgefilipecosta added that the team is available on slack to help with any blocking points while trying to contribute.

#block-editor, #chats, #core-editor, #core-editor-summary, #gutenberg, #meeting-notes

Daniel Richards 6:07 am on August 5, 2021
Tags: , core-editor, ,   

What’s new in Gutenberg 11.2.0? (4 August)

Two weeks have already passed since 11.1, so this week 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/ 11.2 was released. This release seems to have had more of a focus on bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes and tooling, but nevertheless there are still some great features to highlight. Color support has been expanded on two blocks, a new layout option is being tested for parent blocks, and there’s now an option for creating a new post after publishing.

Search 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. – button and border colors

The range of options for customizing blocks continues to improve. The search block now has additional options for customizing button and border colors.

Group block – flex layout

An experimental flex layout option is being beta tested on the group block. This is an early glimpse at a feature that would give parent blocks the capability of defining the layout of their inner blocks.

In the near future the intention is to provide options for changing the orientation, alignment, justification, and spacing within a flex layout.

New button for creating posts as part of the publishing flow

If you’re creating more than one consecutive posts, you can now create a new post from the editor as part of the publishing flow.

11.2.0

Features

  • Search Block: Add color support to search button. (32416)
  • Search Block: Add border color support. (31783)
  • Pullquote: Add border and color support. (30951)

Enhancements

  • Post Editor
    • Add a new page/post button on publish panel. (33276)
  • Widgets Editor
    • WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. inserter: Clarify that the button toggles the inserter. (33561)
    • Update widget editor help links to point to the new support article. (33482)
  • Components
    • Spacer: Change props override order, split types. (33555)
    • Elevation: Reduced motion styles, updated documentation and README. (33551)
    • components: Add unit values utils. (33514)
    • components: Add isValueNumeric util. (33206)
    • [Components]: Add SegmentedControl. (31937)
    • Components: Promote VisuallyHidden from ui into full components (#31244). (31902)
  • 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)
    • Inserter: In text label mode, use “Close” label when inserter is open. (33534)
  • Data
    • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Data: Pass query argument to data selector shortcuts. (33689)

Bug Fixes

  • Block Library
    • 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.: Allow authors to select images uploaded by other users. (33567)
    • Template Part: Avoid button layout shift. (33362)
    • Remove instagram reference from embed block’s description. (33519)
  • Block Editor
    • Fixed that the block is selected instead of the title when using the select all shortcut. (33621)
  • Post Editor
    • Most Used Terms: Avoid 403 error for non-administrators. (33569)
    • Editor: Set ‘hide_empty’ for the most used terms query. (33457)
    • HierarchicalTermSelector: Use TextControl component. (33545)
    • PWA manifest: icon: Fix error when adminadmin (and super admin) bar is gone. (33702)
  • Widgets Editor
    • Fix 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/theme incompatibility, call onChangeSectionExpanded conditionally. (33618)
  • Components
    • Fix: Native UnitControl to handle single unit configuration. (33641)
    • NumberControl: Allow empty values. (33485)
    • BoxControl: Prevent invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. style values. (33444)
    • FocalPointPicker: Check if value is NaN. (33637)
    • UnitControl: Set correct unit when units has one option. (33634)
    • components: Use useCx to fix iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser. support. (33301)
    • Card: Add missing box-sizing CSSCSS Cascading Style Sheets. rules. (33511)
    • CardBody: Change default value of isScrollable to false. (33490)
    • ItemGroup: Fix padding, split types, rename boolean props. (33553)
  • Themes
    • I18ni18n Internationalization, or the act of writing and preparing code to be fully translatable into other languages. Also see localization. Often written with a lowercase i so it is not confused with a lowercase L or the numeral 1. Often an acquired skill.: Fix broken 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. in WP_Theme_JSON_Resolver. (33624)
  • Site Editor
    • Site editor: Check template resolution. (33527)
    • FSE: Fix content height. (33698)
  • Media
    • Format Library: Remove style from inline image if width not set. (32516)

Performance

  • Drag and drop
    • Set passive listener option for use popover scroll to avoid affecting scrolling performance. (33478)
    • Drag items via transform property to avoid layout and re-paints. (33395)

Experiments

  • Full Site Editing
    • Query Pagination: Update the arrows on the Next and Prev pagination blocks. (33626)
  • Block Library
    • Add flex layout support to the block editor. (33359)

Tools

  • Testing
    • E2E: Navigation wait for links before counting them. (33704)
    • Automation: Track Gutenberg performance metrics over time. (33694)
    • Re-enable “Save flow should work as expected” end-to-end test. (33548)
    • Skip some widgets editing related tests. (33547)
    • Enable the reusable blocks skipped test. (33510)
    • Skip end-to-end tests. (33503)
    • Tests: Run Prettier after regenerating test fixture. (33502)
    • Fix screenshots not being captured when snapshots failed. (33448)
    • Add coverage folder to .gitignore. (33413)
    • Automated Testing: Disable remote patterns in tests. (33160)
    • Improve function widgets test. (33489)
    • Make the performance CI job more stable. (33710)
    • Update button block corner radius test to px. (33562)
    • Add unsupported block title translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. test. (33340)
    • Re-enable skipped widgets end-to-end test. (33449)
  • Build Tooling
    • Update sass version to 1.35.2 with fixes. (33433)
    • Improve Feature mapping in automatically generated changelog. (33625)
    • Add depth to git fetch in npm publishing. (33595)
    • Release docs: Add process for creating a point releaseMinor Release A set of releases or versions having the same minor version number may be collectively referred to as .x , for example version 5.2.x to refer to versions 5.2, 5.2.1, 5.2.3, and all other versions in the 5.2 (five dot two) branch of that software. Minor Releases often make improvements to existing features and functionality. of the Plugin. (33546)
    • Docs: Run Prettier after updating APIAPI An 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. in documentation. (33498)
    • Publish android artifacts with publish to s3 gradle plugin. (33441)
    • Build: Split configuration into two parts – blocks and packages. (33293)
    • Automate grouping of release Changelog PRs by feature. (33229)
    • Fix dependency extraction webpack v5 deprecation. (33090)
    • Scripts: Update eslint-plugin-markdown version. (33432)
    • Replace CRLF with LF when generating unminified assets. (33509)

Documentation

  • Add missing space in documentation. (33690)
  • Added common steps of plugin translation. (23535)
  • Packages: Ensure changelog entries are attributed to the correct release. (33590)
  • Add i18n filters to documentation table of contents. (33556)
  • Update the create a block theme how-to guide. (33382)
  • Block API: Improve how blocks assets are versioned. (33075)
  • Update the tested up to version in the readme file. (33760)
  • Correct {% end%} tagtag A directory in Subversion. WordPress uses tags to store a single snapshot of a version (3.6, 3.6.1, etc.), the common convention of tags in version control systems. (Not to be confused with post tags.) – missing a space. (33189)
  • Use tabs instead of spaces in block transform doc example. (33549)
  • Fix flaky widgets end-to-end tests by waiting for the snackbar correctly. (33317)
  • Scripts: Add changlog entry for module update. (33473)
  • Create block: Update “Tested up to” in readme.txt. (33493)

Code Quality

  • Block Library
    • Fix optional params in page list rendering. (33639)
  • Block Editor
    • Block editor: Use ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. events for shortcuts (portal bubbles & contextual). (32323)
    • Block editor: Remove focus stopPropagation from appender. (32003)
    • Block editor: iframe: Incorporate writing flow. (33497)
    • Escape key sanity (avoid event.stopPropagation). (33630)
    • Writing flow: select all: Remove early return for post title. (33699)
    • Remove event.stopPropagation for past WritingFlow/ObserveTyping compatibility. (33632)
  • Post Editor
    • Editor: Refactor Post Author component. (33695)

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~36,000 words, ~1,000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 11.28.48s37.89ms
Gutenberg 11.18.54s38.17ms
WordPress 5.88.43s39.71ms

Kudos to all the contributors that helped with the release! 👏

#block-editor, #core-editor, #gutenberg, #gutenberg-new

Paal Joachim Romdahl 9:45 am on August 3, 2021
Tags: , core-editor, ,   

Editor Chat Agenda: 4 August 2021

Facilitator and notetaker: @jorgefilipecosta

This is the agenda for the weekly editor chat scheduled for Wednesday, August 04, 2021, 04:00 PM GMT+1.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • WordPress 5.8 final release.
  • What’s new in Gutenberg 11.2.0
  • Whats next in Gutenberg: July and August.
  • Project updates based on the latest site editing scope & 5.8 Priorities:
    • 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. based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor.
    • Navigation Block & Navigation Editor.
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
  • Task Coordination.
  • Open Floor.

If you are not able to attend the meeting, you are encouraged to share anything relevant for the discussion:

  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#agenda, #core-editor, #core-editor-agenda, #meetings

Ajit Bohra 12:27 pm on August 2, 2021
Tags: core-editor, , , ,   

Editor chat summary: Wednesday, 28 July 2021

This post summarizes the latest weekly Editor meeting (agenda, slack transcript), held in the #core-editor SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel, on Wednesday, July 28, 2021, 14:00 UTC.

WordPress 5.8

WordPress 5.8 was released on 20th July check out the release post for a complete list of features and enhancements.

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/ 11.1.0

Gutenberg 11.1.0 was released on 21st July check out the release post for a complete list of features and enhancements:

Gutenberg 11.2.0

Gutenberg 11.2.0 RC is now available for testing.

Monthly Plan

The monthly update containing the high-level items that Gutenberg contributors are focusing on for June are:

  • Global Styles.
  • 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.-based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor.
  • Navigation block.
  • Full Site Editing.

For a detailed plan check out monthly priorities post.

Updates on the key projects

@chipsnyder

For the Mobile side of things we have:

  • Soon Working to update the Mobile Gallery Block Refactor with the changes from Web, should be ready this week.
  • Work for the iOSiOS The operating system used on iPhones and iPads. share extension on hold as we investigate some of the technical challenges there
     
    In Progress:
  • Editor Onboarding.
  • Adding search to the block inserter.
  • Embed block.
  • Integration tests.
  • Support GSS Font Settings and specific text color settings.

@annezazu

Task Coordination

Note: Anyone reading this summary outside of the meeting, please drop a comment in the post summary, if you can/want to help with something.

@youknowriad

  • I’m working on the Flex Layout a bit, and experimenting with multi-layout architecture for inner blocks
  • I’ve also spent some time on performance jobs, tooling around that and I’m planning to continue that a bit
  • Reviewing a number of PRs

@get_dave

@mamaduka

  • Refactored Post Author component for editor. It now only makes one request to render the component instead of four.
  • Deprecated getAuthors data selector in favor of getUsers.
  • Fixed regression in withFontSizes HOC. I would love to get some feedback on this PR and maybe ship with 5.8.1.
  • Now it’s possible to pass context to getUser and similar data selector shortcuts.
  • Worked on flaky “Block Hierarchy Navigation” test issue.
  • Fixed issue when hitting maxLength in FormTokenField component triggered an error

@annezazu

  • I was out last week but am working on a few things this week for the #fse-outreach-experiment including a hallway hangout happening likely tomorrow (to be announced soon), a survey of block theme authors, and the next call for testing.
  • Working to try to update the github template to use forms as well to perhaps make it easier for people to report issues.
  • Hoping to fit in some time to triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. too.

Open Floor

@mikeschroder

  • If it’s okay, I’d be interested in shadowing someone close to my timezone (JST, so I’m guessing APAC or EU would work best) on a Gutenberg release, to learn more about what’s involved.
  • I’d eventually love to be able to help with running one, and hoping that would help with learning about the knowledge gaps to fill.

@get_dave

  • Could whoever is running the Gutenberg PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party release today please let me know how they found the automated changelog feature grouping? I worked on a couple of PRs on that and I’m curious to know whether anything could be improved. My DM’s are open.
  • Also on that note, please can I make a plea for folks to consider being even more proactive in assigning labels to GithubGitHub GitHub is a website that offers online implementation of git repositories that can can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged be the repository owner. https://github.com/ Issues? With the correct labels assigned creating the release changelog can be far more automated. I’ve noticed a number of recent PRs without any labels and so I’m hopeful that we can reverse that trend for the benefit of the release leads. Much appreciated.

@mamaduka

  • I try to label the issues, but can do same for PRs as well 

Read complete transcript

#meeting-notes, #core-editor, #editor, #gutenberg, #core-editor-summary

Ajit Bohra 8:18 pm on July 26, 2021
Tags: , core-editor, ,   

Editor Chat Agenda: 28 July 2021

Facilitator and notetaker @ajitbohra

This is the agenda for the weekly editor chat scheduled for Wednesday, 28 July 2021, 14:00 UTC.

This meeting is held in the #core-editor channel in the Making WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/..

  • WordPress 5.8
  • What’s new in Gutenberg 11.1.0
  • 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/ 11.2.0 RC
  • Whats next in Gutenberg: July and August.
  • Project updates based on the latest site editing scope:
    • 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. based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor.
    • Navigation Block & Navigation Editor.
    • Template editor.
    • Patterns.
    • Styling.
    • Mobile Team.
  • Task Coordination.
  • Open Floor.

Even if you can’t make the meeting, you’re encouraged to share anything relevant for the meeting in the comments below:

  • If you have anything to share for the Task Coordination section, please leave it as a comment on this post.
  • If you have anything to propose for the agenda or other specific items related to those listed above, please leave a comment below.

#core-editor #core-editor-agenda #agenda #meetings

Andrei Draganescu 5:30 pm on July 21, 2021
Tags: core-editor,   

Editor chat summary: 21 July, 2021

This post summarizes the weekly editor chat meeting (agenda here) held on Wednesday, July 21, 2021, 02:00PM UTC on Slack. Moderated by @andraganescu.

Announcements

Monthly Priorities & Key Project Updates

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. based WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor

As the project has landed in coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress., there is now a new tracking issue set up for things identified by the community as great follow up work to improve on it.

Mobile Team

  • Shipping: Block picker search and first iteration of the embed block will be shipping in the next release.
  • In Progress: Scoping the next phase of Global Style Support work focusing on text-related styles.

Task Coordination

@ntsekouras

  • Landed SegmentedControl (PR: 31937)
  • I’m working on porting some more components from g2 and will make explorations for more layout integrations. Related Riad’s PR (PR: 33359)

@torounit

  • I am working on refactoring HierarchicalTermSelector (PR: 33418)

@zieladam

@mamaduka

  • Started refactoring FlatTermSelector into a functional component and utilize core data module for fetching terms.
  • While working on this discovered a few minor issues with the “Most Used Terms” component, which should be fixed now.
  • Also, now users with author roles should be able to set featured images uploaded by other users.

@aristath

  • Autogenerate headings anchors – PR: 30825.
  • Allow enqueing multiple stylesheets per-block – PR: 32510.

@getdave

  • I improved the build tooling by automatically grouping changelog items by feature when it is build on CI PR: 33229.

@ajlende

  • Cropping for the site logo needs reviewers PR: 31607.
  • Working on duotone enhancements we can discuss more during open floor PR: 33466.
  • Related bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fix for cover block spacing ui PR: 33560.

Open Floor

A test file was added to WP Core in 5.6.0, but added incorrectly, which means that the tests effectively were never run. I’m trying to fix that, but am now finding that 7 out of the 20 tests are failing. Raised by @jrf

We need someone with good knowledge of global styles to help figuring out if the test’s problem is on the PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher or JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. side of the global styles.

@torounit surfaced issue 33589

This is probably a bug introduced by the recent work on the “select all” behavior in the block editor.

@ntsekouras surfaced a problem in PR: 1483 – It seems there will be the need for WP version check in patterns

The problem lies that patterns can have blocks with shape that is not supported in a WP version, but themes are also checked against WP version that are compatible. This isn’t the same WP version usually.

@ajlende asked if more people think it might be beneficial to have a system to that allow block supports to detect placeholder state.

General support for the idea was offered.

@mikeschroder raised PR: 32516 and asked if this direction is a good approach.

Looking forward for feedback from folks who know the rich-text package and can provide advice. Does that seem along the right lines for a fix?

#core-editor, #core-editor-summary

Héctor Prieto 1:04 pm on July 21, 2021
Tags: core-editor, , ,   

What’s next in Gutenberg? Site Editing status check (Late July-August 2021)

WordPress 5.8 is already here, an exciting release marked by the inclusion of many Full Site Editing features that have been big-picture focuses in recent times. Because of this important achievement, in contrast to normal monthly updates, this post seeks to review the status of Full Site Editing and summarize the next high-level focuses within 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/ Phase 2.

Full Site Editing is the lighthouse goal for phase 2 of Gutenberg. As such, it’s good to remember it is a collection of projects that allow site editing with blocks, bringing powerful capabilities for a smooth editing experience.

WordPress 5.8 includes some of these Full Site Editing projects and features; while some of them will continue as ongoing focuses for subsequent Gutenberg releases (⚒️), others can be considered stable and enter a maintenance phase (✅)

Without further ado, let’s look at the current status of the milestones that have guided Full Site Editing work in the last months and the updated scope for Site Editing.

⚒️ Updated scope for Site Editing projects ⚒️

Site Editing Infrastructure and UIUI User interface

The Site Editing Infrastructure and UI provide foundational work for the rest of FSE projects, mainly in the Site/Template Editor, Template parts, and the numerous APIs that support work around Full Site Editing.

The first two iterations of the site editor milestone introduced editing 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. themes and all their template files. The ongoing third one offers the possibility of creating custom block templates in classic themes and is available in WordPress 5.8 for those themes that opt-in to the site editing experience. Work will continue to finalize the Site Editor naming and placement: the current Site Editor as we know it in the Gutenberg pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party may evolve for better navigation flows and interactions.

Thanks to feedback from different FSE Outreach Program testing rounds, the next focus for site experience and tooling improvement include:

Overview Issues: ✅ Part 1, ✅ Part 2, ⚒️ Part 3

Global Styles

Global Styles comprises two major areas that fall underneath the global styles umbrella: centralized theme configuration and an interface for manipulating visual aspects of blocks globally.

Theme configuration absorbs things like declaring color palettes, presets, different supports and settings, and toggle on or off the available block design tools (typography, colors, dimensions, etc.). All of this can be managed through the theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. configuration file and is one of the key features available in WordPress 5.8. After a few iterations and open testing, this feature is considered stable and moved to a maintenance phase.

The other major part of global styles is the user interface to make edits to blocks globally. With theme.json in place, the next release cycle will have the Global Styles UI as one of its main focuses, allowing users to tweak the theme easily. Color handling will be an important focus, not only to better theme switch but also to seamlessly integrate color palettes with patterns.

⚒️ Global Styles Overview Issue

Theme Blocks

To support the theme building needs outside of the template and template parts infrastructure, there was a need to create many new blocks centered around theme functions. WordPress 5.8 brings several of these blocks, from Site Title, Site Tagline, and Site Logo that allow users to configure site settings with blocks, to the post-related blocks such as Post Title and Post Date, to be used inside a 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. to display post data.

Although new theme blocks may be added as the need arises and the existing ones will receive incremental upgrades, the basics of this milestone are complete.

✅ Theme blocks Overview Issue

Query Loop Block

Among the theme blocks, the Query Loop Block has been a significant area of the site editing focus in the past months, deserving its own milestone. Taking some of the block APIAPI An 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. infrastructures to the limit, such a powerful block has proven challenging to expose at a user level. As a result of the feedback collected in the FSE Outreach Program, the block has been renamed to clear confusion, and usability enhancements have been implemented before launching it in WordPress 5.8.

With the Query Loop foundations in place, the next iterations will seek to ease the user interactions and flows, even more, thanks to two fundamental Gutenberg tools – block patterns and block variations. The former will continue to help set the inner block structure and content. In contrast, the latter will present the powerful Query Loop’s features in the form of preconfigured blocks and consolidate similar blocks to use the Query Loop Block as their underlying mechanism.

✅ Query Loop Block Overview Issue

Navigation Block

Along with the Query Loop Block, the Navigation Block is another theme block that stands out as a project in its own right. This block has seen great improvements in the last few months, from improved overlays to responsive menus. New blocks are available as well, such as the Home Link block. Shortly, we will see the Navigation block house whole new kinds of blocks thanks to the recent frontend markup adjustments that allow blocks other than links in an accessible way.

Because of its key role in building rich theme blocks, the Navigation Block will be one primary focus during the next WordPress release cycle. Apart from more blocks being available inside the Navigation Block, customization options – such as configuring dropdown behavior or adding fullscreen variants – are an area that seeks improvement. These customizations should be design-driven due to the multiple layouts nested navigation menus can have.

⚒️ Navigation Block Tracking Issue

Site Editing Gradual adoption

Full Site Editing represents a new paradigm in site and theme building in the well-established WordPress ecosystem, and as such, providing the right tools is key to gradual adoption. Tools like the Widgets Editor and Navigation Editor bring block editing capabilities to traditional features that can’t take full advantage of their native block counterpart implementation.

WordPress 5.8 brings the power of blocks to both the Block Widgets Editor and the CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.. Users will be able to add blocks in widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas, add widgets and blocks with live preview, and schedule and share directly from the Customizer.

Because blocks can now be added to widget areas, developers are encouraged to phase out their widgets in favor of blocks, which are more intuitive and can be used in more places. Developers can allow users to easily migrate a Legacy Widget block containing a specific widget to a block or multiple blocks. 

On the other hand, the Navigation Editor has also seen its share of iterative improvements in the last months. Together with the Navigation Block, it will remain an ongoing focus for the next WordPress release cycle.

✅ Widgets Editor Tracking Issue

⚒️ Navigation Editor Tracking Issue

Smoothing block interactions

As mentioned with regards to Query and Navigation blocks, the complexity of the editor increases as site editing capabilities are introduced with advanced block structures and customization options. This highlights the need to expand our APIs and interactions — which are well suited for simple block structures — to better support container blocks.

To address some of this, the List View introduced in Gutenberg 10.7, and WordPress 5.8 aims to help navigate these advanced structures more efficiently and should continue evolving further in the future. Internally, the List View is powered by a component available in the post editor List View and advanced blocks like Navigation; all features and blocks having a list of blocks will benefit from the improvements made to this component.

Another challenging editing experience with the increased number of container and inner blocks is adjusting parent block settings when editing a child block.  Users often need to switch between different child and parent blocks to change settings like layout or positioning. In turn, it is necessary to explore Toolbar absorption mechanisms that allow parent blocks to expose their toolbar on their children.

Patterns everywhere

At this stage, it is no secret that block patterns represent considerable potential for users to add many blocks with different preset layouts and settings easily. By using patterns, users don’t need to individually add blocks to achieve rich representations in headers, columns, or Query blocks, as patterns act as a jumpstart blueprint that can be tweaked and adjusted to the user’s needs. 

An example of the improved interaction block patterns is demonstrated by the Query block, which allows users to select block patterns in its placeholder state. This is just the tip of the iceberg in terms of the ways patterns can leverage the editing experience, and as such, efforts will continue improving pattern insertion capabilities.

Thanks to the recently released Block Pattern Directory, patterns can be copied and pasted into the block editor; upcoming Gutenberg iterations will connect and retrieve patterns from this directory, allowing users to choose from huge amounts of beautiful patterns without leaving the editor. Both to ease navigating the big number of patterns users will be able to choose from and accommodate increased pattern complexity and richness, such as in Query or 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. patterns, revisiting the pattern insertion UI will be an ongoing focus in the months to come.

 ⚒️ Pattern Insertion Tracking Issue

Design Tools

Several design tools are needed to ​​ensure a wide range of exquisitely crafted patterns can support powerful settings and rich block customizations. These encompass all tools related to the appearance of blocks and range from colors, typography, alignments, and positioning to filters like duotone, cropping, and background media and will need to integrate seamlessly with theme.json mechanics.

Going further, controls like font size, even if exposed as single values to users in the UI, are built behind the scenes to accommodate different viewport ranges. Apart from providing access to the underlying mechanisms through theme.json, responsive-previewing and device-specific editing will be necessary to support this.

To support the ever-increasing number of tools, 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., while secondary in some regards to the block canvas and toolbar, will need to accommodate many of these tools, whereas the Component System will provide a shared design language between all these controls.

⚒️ Design Tools Overview Issue

How to follow along with Gutenberg

Here’s an overview of different ways to keep up with Gutenberg and the Full Site Editing project. There is also an index page of Gutenberg development-related posts and an updated Site Editing overview issue that breaks down the upcoming work into more concrete next steps.

Ways to Get Involved

While the above items are our focuses, don’t forget that you can always help with triage, testing issues, good first issues, and reviewing PRs. In particular, if you’re interested in helping with triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. but don’t know where to start, there’s a course on Learn WordPress for how to do triage on GitHub! Check it out and join us.

Hearing your feedback is crucial to drive upcoming priorities and iterate on our work, so you are more than welcome to join our Full Site Editing Outreach Program!

If there’s anything we can do to make contributing easier, let us know in the comments or #core-editor chats. While we can’t promise to fix everything, we’d appreciate being aware of any blockers.

Props to @javiarce for creating the images, and to @cbringmann and @mcsf for reviewing the post.

#core-editor #gutenberg-next #gutenberg #full-site-editing

Kerry Liu 4:26 am on July 21, 2021
Tags: , core-editor, ,   

What’s new in Gutenberg 11.1.0? (21 July)

Two weeks have passed since the last 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/ release, which means a new version is available! Gutenberg 11.1 adds the ability to edit a 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. border easily, enables drag and drop support for the List View component, and includes many bugbug A bug is an error or unexpected result. Performance improvements, code optimization, and are considered enhancements, not defects. After feature freeze, only bugs are dealt with, with regressions (adverse changes from the previous version) being the highest priority. fixes centered around the Widgets Editor and Block Library.

Block supports: border

Take an early look at custom block borders! When borders are enabled in a theme.json file, and a block declares that it supports it with the block supports APIAPI An 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., a new block panel is available that lets us change the border radius, width, style, color, and border units.

Set and style custom block borders

List View drag and drop

Intuitively move and reorder blocks using drag and drop in the List View.

Use the persistent list view to reorder blocks

11.1.0

Enhancements

  • Adminadmin (and super admin) panel available as PWA. (33102, 33310)
  • Block Breadcrumbs: Small chevron icon for breadcrumb separators. (33042)
  • Block Library:
    • Columns Block:
      • Add stack on mobile setting to allow for columns without mobile breakpoints. (31816)
      • Add the percent unit to the default units in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. (33468)
    • Latest posts: Remove grey color for dark themes. (33325)
    • List Block: Add link color control to list block. (33185)
    • Post Terms Block: Add a “separator” attribute to post-terms block. (32812)
    • RSS Block: Update block styles. (33294)
    • Tag Cloud Block:
      • Add ability to change number of tags shown. (32201)
      • Remove editor style so editor matches frontend. (33289)
  • Design Tools, Border:
    • Add support for custom border units. (33315)
    • Update border support UIUI User interface. (31585)
    • Set border style none when border width zero. (32080)
  • Link Editing: Add Unlink button to LinkControl popover. (32541)
  • List View: Enable drag and drop in List View. (33320)
  • WidgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. Editor: Adds auxiliary class names for editor styles. (33388)
  • General UI:
    • Block Settings Menu: Don’t render ‘Move to’ if there is only one block. (33158)
    • Disable ‘Post Publish’ button if saving non-post entities. (33140)
    • Preferences: Polish labels and consolidate options in preferences. (33133)

New APIs

  • REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/.: Block editor settings endpoint. (33128)
  • UI Components: Add a SearchControl component and reuse across the UI. (32935)

Performance

  • Improve List View performance. (33320)
  • Pattern Directory: Caching updates. (33052)

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)

  • Improve high contrast mode rendering of icon buttons. (33062)

Bug Fixes

  • Block Breadcrumbs: Fix breadcrumbs htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. structure and ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. warnings. (33159)
  • Block Editor:
    • Move layout styles to document head (instead of rendering inline). (32083)
    • Warn only in edit implementation when using useBlockProps. (33380)
    • Iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser.: Remove reset styles. (33204)
  • Block Library:
    • Buttons Block: Remove green background color in button preview. (33116)
    • Embed Block: Include missing attributes when upgrading embed block. (33235)
    • Image Block:
      • Improve “can switch to cover” check. (33095)
      • Fix replace link control styling. (33326)
    • 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:
      • Prevent entering invalidinvalid A resolution on the bug tracker (and generally common in software development, sometimes also notabug) that indicates the ticket is not a bug, is a support request, or is generally invalid. values in the Query Loop block configuration. (33285)
      • Update getTermsInfo() to workaround parsing issue for translatable strings. (33341)
    • Search Block:
      • Fix search block button position dropdown accessibility/UXUX User experience issues. (33376)
      • Update search block to handle per corner border radii. (33023)
    • Site Title: Decode entities in site title. (33323)
    • Home Link: Remove padding. (33461)
    • Post Except: Fix excerpt_more 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. conflictconflict A conflict occurs when a patch changes code that was modified after the patch was created. These patches are considered stale, and will require a refresh of the changes before it can be applied, or the conflicts will need to be resolved. and remove wordCount attribute. (33366)
  • Design Tools:
    • Color: Prevent color panel from showing as empty. (33369)
    • Duotone:
      • Avoid rendering duplicate stylesheet and SVG. (33233)
      • Update conditions to hide duotone panel. (33295)
    • Theme.jsonJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.
      • Allow themes to provide empty values for color.duotone and spacing.units. (33280)
      • Specify what settings can be part of settings.layout. (33303)
  • Rich text:
    • Fix format deregistration. (31518)
    • Autocomplete: Reset state for empty text. (33450)
    • Run input rules after composition end. (33416)
  • Site Editor: Close navigation 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. when all posts clicked. (33393)
  • Slash Inserter: Fix slash command focus style. (33084)
  • Widgets Editor:
    • Fix moving inner blocks in the Widgets CustomizerCustomizer Tool built into WordPress core that hooks into most modern themes. You can use it to preview and modify many of your site’s appearance settings.. (33243)
    • Fix inserter size on Widgets Editor 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.. (33118)
    • Merge conflicting wp.editor objects into a single, non-conflicting module. (33228)
    • Retrieve latest widgets before loading sidebars. (32997)
  • Writing flow:
    • Allow select all from empty selection. (33446)
    • Attempt to fix preview end-to-end failure. (33467)
  • Components:
    • Suggestion List: Check if a node exists to scroll into view. (33419)
    • Navigation component: Fix item handling onClick twice. (33286)
  • Editor: Extract snackbars into a separate component. (33355)

Experiments

  • Component System:
    • Promote g2 Popover as Flyout. (32197)
    • Add useControlledValue. (33039)
    • Add normalizeArrowKey. (33208)
    • Add mergeEventHandlers. (33205)
    • Add useCx. (33172)
    • Add useLatestRef hook. (33137)
    • Remove @emotion/css from Divider. (33054)
  • Navigation Block:
    • Add Color Options for Submenus. (31149)
    • Change Navigation block markup on front end only. (30551)
    • Improve handling of open overlay. (32886)
    • Menu item placeholder inheritance. (32512)
    • Pass block attributes with rendering with location. (33043)
    • Refactor of navigation block rendering using location attribute. (33244)
  • Global Styles:
    • Cover against non existing styles. (33127)
    • Missing link color on style properties to css var mapping. (33150)
    • Preset variables not being user on the site editor. (33149)

Documentation

  • Admin PWA: Make readme private. (33216)
  • Handbook:
    • Block API:
      • Apply enhancements included in WordPress 5.8. (33252)
      • Clarify the type of apiVersion in block metadata. (33249)
      • Fixes a typo in the documentation for block supports. (33247)
    • Block Editor API: Changes to support multiple admin screens in WP 5.8. (33262)
    • Custom Block Editor: Fixed bad image syntax and bold text. (32897)
    • Fix API documentation for data reference guides. (33384)
    • 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 Release: Update Gutenberg release documentation to clarify release post workflow. (33328)
    • theme.json:
      • Add examples and highlight backward compatibility. (33421)
      • Update theme.json documentation for WordPress 5.8. (33131)
      • Fix codetabs syntax in theme.json documentation. (33417)
    • Use markdown headings instead of links for API declarations. (33381)
  • Update documentation for link color in WordPress 5.8. (33162)
  • Packages:
    • Add PanelBody for InspectorControls. (33227)
    • Correct wrong setState call. (32808)
    • Remove withState HOC references. (33173, 33222, 33259)

Code Quality

  • Avoid calling gutenberg_ functions within code shipped through WordPress Core. (33331)
  • Block Editor:
    • Refactor the user autocompleter to avoid apiFetch and rely on the data module. (33028)
    • Warn when useBlockProps hook used with a wrong Block API version. (33274)
  • Block Library:
    • Image Block: Fix uncaught error. (24334)
    • Latest Posts Block: Refactor to drop apiFetch usage in favor of using the data module. (33063)
    • Template Part Block: Remove unnecessary function exists check on wp_filter_content_tags. (33182)
  • Components:
    • BlockNavigation: Restructure the BlockNavigation component. (31892)
    • Box Control: Rename VerticalHorizontalInputControls to AxialInputControls. (33016)
    • GradientPicker: Stabilises GradientPicker and CustomGradientPicker components. (31440)
    • Toolbar: Enforce isAlternate on ToolbarDropdownMenu. (33129)
    • ZStack: Remove @emotion/css from ZStack. (33053)
  • Packages: Hoist dependencies for WordPress packages. (33387)
  • Plugin: Remove deprecated APIs that are no longer supported in version 11.0. (33258)

Tools

  • Testing:
    • Add basic Site Title block coverage. (32868)
    • Add some functionality to createUser and deleteUser. (33067)
    • Enable previously skipped widgets tests. (33121)
    • Skipping more end-to-end tests. (33353)
    • Skip unstable end-to-end tests. (33352)
    • Switch to new puppeteer APIs for emulating conditions. (33410)
    • Update end-to-end tests to use new puppeteer drag and drop api. (33386)
  • Dependencies:
    • Update CopyWebpackPlugin to v6. (33220)
    • Upgrade Husky to 7.0.0 and git ignorance improved. (33183)
    • Upgrade Puppeteer to 10.1. (33327)
    • Upgrade Storybook to v6.3. (33219)
  • NPM Packages: Introduce release types to npm publishing script. (33329)
  • Plugin: Introduce tools folder with configuration files. (33281)
  • Workflows:
    • Release Workflow: Remove “experimental” status from WP 5.8 stable items. (33214)
    • Re-enable manually triggered workflows on forks. (32821)
    • Use NPM caching built into action/setup-node. (33190)

Performance Benchmark

The following benchmark compares performance for a particularly sizeable post (~36,000 words, ~1,000 blocks) over the last releases. Such a large post isn’t representative of the average editing experience but is adequate for spotting variations in performance.

VersionLoading TimeKeyPress Event (typing)
Gutenberg 11.16.38s26.12ms
Gutenberg 11.06.06s29.55ms
WordPress 5.78.52s36.26ms

Kudos to all the contributors that helped with the release! 👏

Thanks to @javiarce for creating the release post assets, @cbringmann for proofreading, and @priethor, @youknowriad, and @get_dave for guiding me through this release!

#block-editor, #core-editor, #gutenberg, #gutenberg-new