What’s new in Gutenberg 11.4? (1 September)

Depending on where you live, it’s the first day of Spring. Or Autumn. Or, if you live on Venus, just another season of sulphuric acid showers.

No matter where you are, 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.4 has been released with new features to brighten your mood including the refactored Gallery BlockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience., duotone filters for featured images, and more block design tools!

Gallery Block now uses Image Blocks

The Gallery Block now acts as a wrapper for coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Image Blocks.

Individual gallery images will therefore feature all existing and future functionality of not only Image Blocks – for example, the ability to add custom links, filters, and styles – but also standard block behavior such as move, drag and drop, copy, and keyboard navigation.

For now, the new Gallery Block can be enabled on the Gutenberg Experiment page, but the plan is for the Gallery Block to ship with WordPress 5.9.

Theme and 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 authors can get wise about backward compatibility recommendations over in the Gallery Block Refactor Dev Note.

Duotone filters for featured images

Duotone filters were introduced to image and cover blocks in 10.6. By extending duotone filters to Post 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. blocks, 11.4 enables us to set consistent effects across post and page templates, recent posts lists, and Query Block content.

Padding support for Button Blocks

As of 11.4, we can define padding for Button Blocks with the further option of linking padding values to vertical and horizontal axial sides.

The aim is to provide greater control as well as uniformity in the way we display button elements. We can still set a single padding value for all sides – adding extra vertical or horizontal padding just gives us that extra flexibility to create variations on our design patterns.

Support for block gap spacing

Having a consistent way to tweak the margin/gap between blocks has been a long-standing feature requestfeature request A feature request should generally begin the process in the ideas forum, on a mailing list, as a plugin, or brought to the attention of the core team, such as through scope meetings held for each major release. Unsolicited tickets of this variety are typically, therefore, discouraged.. 11.4 introduces the groundwork for adding gap spacing control to blocks such as Buttons, Images, and Columns, opening up the possibility of more powerful and precise layout tools.

There’s work in progress to bring this to the editor so stay tuned for updates in upcoming releases!

Other notable highlights

Font weight support is now available for the Post Date and Post Terms Blocks.

An “early betaBeta A pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process.” feature has also made it into 11.4: the ability to expose a parent block’s toolbar controls to its child blocks. A use case would be changing the alignment of Buttons when editing a single Button. Keep an eye out for a request for feedback on this developing feature soon.

11.4.0

Enhancements

  • 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)
    • Cover Block: Allow alt text in Cover blocks. (33226)
    • Add aria-describedby to custom select control component to describe currently-selected font size. (33941)
  • Block Editor
    • Block Lists: improve 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. block, pattern and template previews. (28165)
  • Block Library
    • 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.: update Post Template sub-block icon. (34204)
    • Convert Gallery block to use Image blocks. (25940)
    • Post Featured Image: add duotone block supports. (34113)
    • Post Featured Image: add contextual help text to the scaleproperty. (34158)
    • File block: update transform from image to use image filename if caption is empty. (34256)
    • Post date Block: add font weight support to the block. (34070)
    • Post terms: add font weight support to the block. (34142)
    • Site Tagline: add font weight support. (33983)
    • Button: update spacing support to use axial padding. (33859)
  • Components
    • Add deprecated props adapter for ColorPicker. (34014)
    • Wrap SegmentedControl in a BaseControl with an added help property. (34017)
    • Combobox: update the current selection if the list of suggestions is filtered. (33928)
    • Post Title: use rich text hook and updating 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.) to h1 (31569)
  • Design Tools
    • Add layout default value support for blocks. (34194)
    • Dimensions Panel: add padding tool as default for blocks where this is a common setting. (34026)
  • Navigation Screen
    • Update navigation screen topbar. (34166)
  • Packages
    • Updates the “settings” icon, which toggles the display of additional controls in an interface. (34165)
  • Post Editor
    • Migrate post editor feature preferences to the interface package. (34154)
  • Widgets Editor
    • Migrate customize widgets feature preferences to interface package. (34135)
    • Refactor editor ‘feature’ preferences to interface package. (33774)

Bug Fixes

  • 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.
    • Spacing/Dimensions Supports: separate spacing from dimensions for compatibility purposes. (34059)
  • Block Editor
    • Font-size adjustment for tablet and mobile device previews. (33342)
    • Fix single block selection by holding shift key. (34137)
    • Fix unwanted additional spaces added around pasted text on Windows. (33607)
    • Inserter: prevent non-deterministic order of inserter items. (34078)
    • Try: Fix multiselect toolbar indent and reformat BlockContextualToolbar(). (34038) (34173)
  • Block Library
    • Latest Comments: use site localeLocale A locale is a combination of language and regional dialect. Usually locales correspond to countries, as is the case with Portuguese (Portugal) and Portuguese (Brazil). Other examples of locales include Canadian English and U.S. English. in the editor. (33944)
    • Navigation: fix vertical layout on the frontend. (34226)
    • Navigation: add z-index value to responsive menu overlay. (34228)
    • Navigation: enable flex on container to fix space between. (34258)
    • Navigation: fix submenu icon positioning. (34168)
    • Navigation block: add missing </ul> closing tag. (34077)
    • Post ExcerptExcerpt An excerpt is the description of the blog post or page that will by default show on the blog archive page, in search results (SERPs), and on social media. With an SEO plugin, the excerpt may also be in that plugin’s metabox.: remove interactive formatting. (34083)
    • RichText: fix space key for button and summary elements. (30244)
    • Search Block: add space between generated border class names. (34025)
  • Build Tooling
    • Webpack: Fix watch on .json and .php files. (34024)
    • Pin TypeScript dependency to a specific version to avoid pulling in breaking changes. (34422)
  • Components
    • Fix RTL on Flex component. (33729)
    • NavigationSidebar: fix template content for content-navigation-item preview. (34203)
    • Remove deprecated import style for storybook/addon-docs. (34095)
    • ToolsPanel: add tools panel item deregistration. (34085)
    • Post Title: remove wrapper div and fix border style. (34167)
  • Core Data
    • GetEntityRecords returns items even if some included IDs don’t exist. (34034)
  • Design Tools
    • Allow zero values for theme.json styles. (34251)
  • Global Styles
    • Site editor: fix for how CSSCSS Cascading Style Sheets. custom properties are generated. (33932)
  • Packages
    • Rich Text: add check to toTree() in replacements before accessing its type. (34020)
  • Post Editor
    • Fix selector params in isPluginItemPinned() selector. (34155)

Performance

  • Data Layer
    • Data: Add a batch function to the data module to batch actions. (34046)

Experiments

  • Block API
    • Block Editor: absorb parent block toolbar controls. (33955)
    • Block Editor: use groups for InspectorControls. (34069)
  • Block Library
    • Add generic classnames to children of Navigation. (33918)
  • Global Styles
    • Add slashes back to 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.. (33919)
    • Add block spacing gap configuration to theme.json and add support for this CSS variable to the “flow/default” layout. (33812)

Documentation

  • Handbook
    • Alphabetize glossary entries. (34058)
    • Correct minor typos in wp-plugin.md (34185)
    • Remove extraneous params from block_type_metadata hook. (34151)
    • Update incorrect settings examples in “Global Settings & Styles”. (34084)
    • Use block.json to add attributes in create block tutorial. (33978)
    • Fix typo in block gap documentation in theme-json.md. (34231)
    • Fix broken mobile testing documentation link in testing-overview.md. (34187)
    • Fix typo in legacy-widget-block.md. (34103)
    • Update spelling and fontSize examples in create-block-theme.md. (34152)
  • Library
    • Bump mobile version in experiments page for Gallery. (34220)
  • Packages
    • Add documentation for mobile components directory. (33872)

Code Quality

  • Block Editor
    • Render head and body with single portal for block previews. (34208)
    • BlockList: refactor element context for style/svg appending. (34183)
    • BlockList: use InnerBlocks internally. (29895)
  • Components
    • Unit Control: add unit tests for getValidParsedUnit utility method. (34029)
    • Rename SegmentedControl to ToggleGroupControl. (34111)
    • Dropdown Menu: remove min-width from the dropdown component and add whitespace rule to avoid wrapping (33995)
  • Core Data
    • Allow passing store definitions to controls. (34170)
  • Site Editor
    • Remove extra DOM element used for template part overlay. (34012)

Tools

  • Build Tooling
    • Automated Changelog: force group all documentation tasks under Documentation. (34042)
    • Automated Changelog: rename “Editor” grouping to “Post Editor” to avoid ambiguity with other editors. (34093)
    • Automated Changelog: sort feature groups by issue name. (34071)
    • Automated Changelog: use nested headings for feature groups instead of indenting lists. (34040)
    • Automated Changelog: remove Uncategorized 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. in output and place items at top. (34037)
    • Add Typescript extensions to watched files. (34094)
    • Remove obsolete step that pushes tags in NPM publishing flow. (34114)
    • Release workflow: only commit modified changelogs. (34211)
  • ESLint
    • Eslint plugin: use @typescript-eslint/no-duplicate-imports in TS projects. (34055)
  • 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/ Contributor Templates
    • Issue Forms: simplify the 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. report form template. (34007)
  • Logs
    • Hide deprecation logs under a console group. (34163)
  • Testing
    • Emulate reduced-motion in end-to-end tests. (34132)
    • Re-enable Android end-to-end tests. (34243)
    • Remove extra props from Cover deprecations. (34066)
    • Remove the ENVIRONMENT_DIRECTORY env variable that was added to the performance jobs. (34086)
    • Add snapshot test for changelog formatting. (34049)
    • Experiment with using 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/. in end-to-end tests to build up states. (33414)

Performance benchmark

VersionLoading TimeKeyPress Event (typing)
Gutenberg 11.46.35s36.87ms
Gutenberg 11.36.29s36.97ms
WordPress 5.86.91s35.48ms

Thanks to @critterverse for our release preview assets, @priethor for guiding the release, @noisysocks, @talldanwp, and @andrewserong for their help with the release build and deployDeploy Launching code from a local development environment to the production web server, so that it's available to visitors., and to all who contributed to this release. Thank you for your splendid work!

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

Editor Chat Agenda: 1 Sept 2021

Facilitator and notetaker: @annezazu

This is the agenda for the weekly editor chat scheduled for 2021-09-1 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/..

  • 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.4). This release is planned for the day of the meeting.
  • Whats next in Gutenberg: July and August. If a September edition is out by the meeting time, we’ll refer to that.
  • Updates based on updated scope for site editing projects and WP 5.8:
    • 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.
    • 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 an update for the main site editing projects, please feel free to share as a comment or come prepared for the meeting itself.
  • 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

Editor chat summary: 25 August, 2021

This post summarizes the weekly editor chat meeting (agenda here) held on Wednesday, August 25, 2021, 04:00 PM GMT+1 in Slack. Moderated by @paaljoachim.

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

Gutenberg 11.3.0 release notes. Thanks to @vcanales for writing the notes and tackling the release!

New feature highlights:

  • New Dimensions Panel
  • 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. inserter performance improvements
  • Dimension controls for 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. Block
  • New icons for Reusable Blocks and Template Parts

Gutenberg 11.4 RC is available for testing.

Whats next in Gutenberg: July and August

July and August monthly priorities.

Key project updates

Based on the scope for Site Editing projects.

Template Editor

Check out the – Site Editor Template mosaic view

Global Styling

  • A proposal of an API to make blocks aware of their global styles. This 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. will allow the UIUI User interface of a block to show their true styles by default.

Navigation Block & Navigation Editor

  • The team have been focused on reforming the project around the goal of removing the “experimental” status of the feature within the Gutenberg Plugin (only).
  • Held a Hallway Hangout on Tuesday to compare and contrast Navigation screens and determine next steps.
    A summary of the meeting and decisions made is available.
  • Tracking issue is being updated to focus on the tasks required to remove “experimental”.
  • Work is continuing on exploring wider architectural issues such as how to best make use of the Navigation block whilst retaining stability.
  • We’ve continued with small UI/UXUX User experience fixes.

Mobile

  • Help menu option that teaches users about the block editor
  • Typography controls to manipulate the font size and line height and improved color settings

In progress:

  • Finalizing Block Picker Search
  • Embed block
  • Editor onboarding help section
  • GSS Font size, line height, colors

Components squad

At the time of the meeting there were no updates on the Pattern project.

Refactored Gallery block

The refactored Gallery block main PR from October 2020 has now finally been merged, and will be included as part of Gutenberg plugin 11.4. There is also a dev note on make core.

Task Coordination

@joen

@annezazu

  • Responding to Full Site Editing (FSE) feedback, testing FSE items, and helping amplify various efforts.
  • Working on a coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. editor improvement post about featured image block improvements.

@get_dave

Open Floor

@get_dave

Friendly reminder from Dave to add the most appropriate labels to PRs in 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/, whether you’re submitting PRs or helping with triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors.. All efforts there make work easier for the release leadRelease Lead The community member ultimately responsible for the Release..

@paaljoachim

It would be very helpful for us who run the Core Editor Meetings to have tracking issues that are updated once a week, so we can share the project updates during the meeting. As it will also give a nice overview and it would make it easier for anyone to follow along to see the progress over time.

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

Editor Chat Agenda: 25 August 2021

Facilitator and notetaker: @paaljoachim

This is the agenda for the weekly editor chat scheduled for Wednesday, August 25, 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/..

  • What’s new in Gutenberg (11.3)
  • Whats next in Gutenberg: July and August.
  • Updates based on updated scope for site editing projects and WP 5.8:
    • 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.
    • 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, #meeting

Gallery Block Refactor Dev Note

The problem

If you have ever added a custom link to an image blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. and then tried to do the same on a Gallery image, you will understand the frustration and confusion of not having consistency between different types of image blocks. This inconsistency is because the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Gallery block stores the details of the included images as nested <img> elements within the block content. Therefore, the images within a gallery look and behave different from images within an individual image block. There are some long-standing open issues related to this:

The only way to fix this with the Gallery block in its current state is to try and replicate the additional functionality that the Image block has in the Gallery block, and vice versa. While this would be possible, it would lead to an additional maintenance overhead to keep the UIUI User interface and underlying code in sync between the two blocks.

Changes made

To make the behavior of images consistent between the Image Block and Gallery, while avoiding code duplication, the core Gallery block has been refactored to save the individual images as nested core Image blocks using the standard core innerBlocks APIs. To make this work with the innerBlocks 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., the gallery structure also had to change from an ordered list to a collection of figure elements within a figure. This structure change also brings the core Gallery block into line with the W3C WAI guidelines on the grouping of images.

The structure change means that Gallery images now have the ability to add custom links, or custom styles, for each image. An example of the flexible Gallery layouts this opens up can be seen below.

Gallery images will also automatically inherit new functionality that is added to the Image block, including those added by plugins. Below is an example of a Gallery block making us of the Image wave style and vintage 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. option added by the CoBlocks 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.

Other benefits include being able to use the standard move, drag and drop, copy, duplicate, and remove block functionalities. Keyboard navigation also benefits from the adoption of the standard block model by the Gallery block.

What theme and plugin authors need to do before 5.9

To support the new Gallery block format, plugin and theme authors should aim to do the following before the December release of this change in WordPress 5.9.

  • Any gallery related CSSCSS Cascading Style Sheets. should have additional selectors added to target images in the following structure in both the editor and front end (existing selectors must remain to support the existing gallery block content). The new structure can be seen below. See this issue for an example of the type of additional selectors that may need to be added.
<figure class="wp-block-gallery blocks-gallery-grid has-nested-images columns-default is-cropped">
	<figure class="wp-block-image size-large">
		<img
			src="http://localhost/image1"
			alt="Image gallery image"
			class="wp-image-71"
		/>
	</figure>
	<figure class="wp-block-image size-large">
		<img
			src="http://localhost/image2"
			alt="Image gallery image"
			class="wp-image-70"
		/>
	</figure>
</figure>
  • For custom blocks with options to transform->from and transform->to the core Gallery block the plugin should be tested with the GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ plugin to ensure that these transformations work correctly with both existing gallery content and the new gallery block format

In the future, when the new Gallery format is stable in a core release, the transformation filters will be deprecated, and plugin authors will need to update their transformations to handle both Gallery formats. Notice will be given ahead of this change being made.

It is also expected that existing gallery content will be automatically migrated to the new format. This will allow the old gallery version’s code to be removed from the codebase. There is currently no time frame set for this to occur.

Additional context and considerations

Other existing solutions

Third-party block developers are currently solving some of the problems caused by the limitations of the core Gallery block by implementing their custom Gallery blocks. These include some of the missing functionality, like the ability to add custom links to individual images. This can be problematic for site owners and content editors due to a large number of Gallery blocks that offer very similar functionality, but none of which appear to provide a close match to the functionality available with individual core Image blocks.

There do not appear to be any examples of plugins that already solve this problem in a way that utilizes Image blocks as inner blocks.

Backwards compatibility considerations

This is a breaking change due to the fundamental change in the underlying Gallery structure. Due to the large number of Gallery blocks already in use, along with themes and plugins that may rely on the existing structure, the following steps have been taken to mitigate the impact of this change on theme and plugin developers as much as possible:

  • Initially, there will be no automatic migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. of existing gallery content. This means that all existing gallery content will behave the same in the editor and front end as it does now, so will be compatible with existing plugins and themes. Only new gallery blocks added after this change will have the new structure in the editor and the front-end.
  • Two temporary transformation filters have been added that will handle the transformation of 3rd party blocks to and from the core gallery block

Possible edge cases

The refactored Gallery format has been tested against the following sample block libraries that have existing transforms to and from the core Gallery block:

The following themes have also been tested to make sure that both the existing gallery content and the new format galleries display correctly:

  • TwentyNineteen
  • TwentyTwenty
  • TwentyTwentyOne
  • Astra
  • Arbutus

While the refactored gallery works effectively with these plugins and themes, there may be edge cases in other plugins and themes that have not been accounted for. Themes that heavily modify the gallery CSS based on the existing <ul><li></li></ul> will definitely need to be updated if the same style changes need to be applied to the new gallery format.  Therefore, it is recommended that theme and plugin authors test the changed gallery block well in advance of the 5.9 release.

Additional details about this change 

Previous discussions about this change can be found on the main pull request or call for testing.

#5-9, #core-editor, #dev-notes, #gallery, #gutenberg

What’s new in Gutenberg 11.3? (18 August)

Two weeks have passed since 11.2, so here we are again for a new 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, 11.3.0. This update includes inserter performance improvements, new controls for 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. Dimensions, and some enhancements around how we handle Featured Post Images.

New Dimensions Panel

Replacing the Spacing Panel, this new Dimensions Panel gives us a deeper control over supported spacing, size, and other related style options. It also offers the ability to customize what you’d like to have shown. This is a great addition that builds on the overall dimension controls work across blocks.

Block inserter performance improvements

The block inserter is getting a big performance boost! Enjoy searching and inserting blocks with speed and ease.

Dimension controls for 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. Block

There are now new height, width, and scale controls for the featured image block, bringing it into greater parity with the Image block. This change impacts the Query LoopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop. block in a big way by allowing even more layout options.

New icons for Reusable Blocks and Template Parts

New icons are now available for Reusable Block and Template Parts to make them each more recognizable and more intuitive to interact with.

11.3.0

Enhancements

  • Block Library
    • Button: Add padding block support. (31774)
    • Post Featured Image: Add basic dimension controls. (31634)
    • Template Part: Try new icons for reusable blocks and template parts. (34002)
  • Block Patterns
    • Add translationtranslation The process (or result) of changing text, words, and display formatting to support another language. Also see localization, internationalization. context on titles. (33734)
  • Block Editor
    • Enable rich previews for internal links. (33086)
  • Components
    • Add new ColorPicker. (33714)
    • Promote ItemGroup. (33701)
    • Polish the focus style for the segmented control. (33842)
    • Tune appender margin. (33866)
    • Update snackbar to use framer motion instead of reactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. spring. (33717)
    • Use updated range styles. (33824)
  • CSSCSS Cascading Style Sheets. & Styling
    • Reduce specificity of reset & classic styles. (32659)
  • Document Settings
    • Disable spellcheck and autocomplete in permalink slug field. (33708)
  • Global Styles
    • Dimensions Panel: Add new ToolsPanel component and update spacing supports. (32392)
  • 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/.
    • Improve the likelihood of getting rich link previews by modifying UA string for URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org Details REST API endpoint. (33747)
  • Site Editor
    • Add error boundary. (33921)
  • Template Editor
    • Template Mode: Add busy state to template creation modal. (33076)
  • Widgets Editor
    • Add error boundaries to 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. screens. (33771)

Bug Fixes

  • 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)
    • Fix some JAWS bugs. (33627)
  • Block Library
    • Button: Fix justification for button block when selected. (33739)
    • Image: Fix issue with canInsertCover not being set to false for empty arrays. (33863)
    • Query Pagination Numbers: Fix first page’s link. (33629)
  • 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.
    • Dimensions Support: Switch dimensions block support back to using spacing key. (34030)
  • Block Editor
    • Closing the block inserter decrements block type impressions. (33906)
    • Fix block appender position in classic themes. (33895)
    • Fix positioning discrepancy with draggable chip. (33893)
    • Force link text to wrap in the Link UIUI User interface when encountering extra long link text. (33753)
    • Improve display of LinkURL menu and fix spacing. (33652)
    • Only show rich preview for image and description if data is available. (33660)
    • URL Details: Avoid PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher notice when parsing protocol-relative icon URLs. (33779)
  • Components
    • useBreakpointIndex: Attach resize event listener to window instead of document. (33902)
    • Components: Fix RTL on custom gradient picker. (33831)
    • FontSizePicker: Use number values when the initial value is a number. (33679)
    • FormTokenField: Avoid error when maxLength value is hit. (33623)
  • CSS & Styling
    • Fix navigation block placeholder preview markup. (33963)
  • Global Styles
    • Avoid rendering duplicate elements stylesheet. (33680)
    • Fix presets for blocks with multiple selectors. (33951)
    • Fix Global Styles transient key clash. (33844)
  • MetaMeta Meta is a term that refers to the inside workings of a group. For us, this is the team that works on internal WordPress sites like WordCamp Central and Make WordPress. Boxes
    • Fix Safari 13 metaboxes from overlapping the content. (33817)
  • Navigation Editor
    • Avoid React warning when creating a new menu. (33843)
    • Fix regressed menu selection dropdown placeholder value for Nav Editor menu locations UI. (33748)
  • Site Editor
    • Fix the site editor breaking in firefox. (33896)
  • Post Editor
    • Editor: Safer isPreviewingPost check. (33840)
  • Template Editor
    • Only show post template actions to users with correct capabilities. (33392)

Performance

  • Block Library
    • Improve the rendering/update performance of the image block. (33974)
    • Do not add to the block-library CSS bundle the colors that come from theme.json. (33924)
  • Block Editor
    • Lazy render the inserter search results. (33868)
    • Lazy render block types in the inserter. (33749)
  • Parsing
    • Improve the performance of the parser by removing the automatic custom classnames handling. (33903)
  • Post Editor
    • Refactor the HierarchicalTermSelector so that it does not cause unnecessary loading of terms. (33418)
  • Template Editor
    • Template Mode: Remove ‘per_page’ argument from the template data selector. (33742)

Experiments

  • Full Site Editing
    • Site Editor: Implement a settings object 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.. (33737)
    • Template part selection popover – minor style updates for visiblity. (33733)
    • Template Part placeholder – Add title step to creation flow. (33703)
  • Navigation Block
    • Navigation: Fix navigation block appender 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. htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers.. (33964)
    • Enable the ability to remove a link from the Nav Link block in the Nav Block. (33777)
    • Fix navigation margin collapsing. (33021)

Documentation

  • Handbook
    • Add documentation to disable remote calls for block patterns. (33930)
    • Add missing comma. (33764)
    • Add more details about block attributes. (33880)
    • Add spaces in add_theme_support documentation code. (33796)
    • Correct spelling and grammar in documentation. (33860)
    • fix: supports.color.gradients is plural. (33781)
    • fix: Broken link in documentation to block support mechanism. (33780)
    • Update documentation to reflect new automated process for feature grouping. (33573)
    • link fix: Block editor 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. Tutorial. (33308)
  • Library
    • Fix gutenberg_resolve_template() return documentation. (33800)
    • Fix misspelling of “queries” in filter documentation. (33799)
  • Packages
    • Example for rest_endpoints filter in PHP. (33738)

Code Quality

  • Block Library
    • Site Logo: Use getMedia shorthand. (33992)
    • Featured Image: Use getMedia shorthand. (33943)
    • Search Block: Removed components class from icon button and polished css. (33961)
  • Components
    • Components utils: rtl() return type, rtl.watch() utility. (33882)
    • InputControl to TypeScript. (33696)
    • Use the __unsafe_useEmotionCache in the useCx hook. (33982)
  • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. Data
    • Deprecate getAuthors in favor of getUsers. (33725)
  • Global Styles
    • No longer read from experimental-theme.json. (33904)
    • Remove the experimental prefix and rename theme.json files. (33925)
  • Post Editor
    • Refactor MetaBoxesArea to to functional components using hooksHooks In 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.. (30542)
  • Scripts
    • Fix typo in format change message. (33945)

Tools

  • Testing
    • Add search performance measures and make other measures more stable. (33848)
    • Avoid double parsing the content when loading the editor. (33727)
    • Block Hierarchy Navigation waits for the column to be highlighted. (33721)
    • Widgets Editor: Try to fix flaky 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. inspector test. (33890, 33965)
  • Build Tooling
    • Readable JSJS JavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. assets 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: Fix webpack 5 support. (33785)
    • Scripts: Use cssnano to minimize CSS files with build. (33750)
    • Scripts: Webpack configuration update to minimize CSS. (33676)
    • Scripts: Update webpack to v5 (try 2). (33818)
    • Scripts: Add missing fallback for target in webpack 5 configuration. (34112)
  • ESLint
    • Include .jsx extenstion when linting import statements. (33746)
  • 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/ Contributor Templates
    • Update 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. issue template to use forms. (33713, 33786, 33761)
  • Plugin
    • Plugin: Fix jsdoc/check-line-alignment ESLint warnings. (33901)
    • Correct function_exists() check typo introduced in #33331. (33513)

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.37.23s38.57ms
Gutenberg 11.27.82s37.89ms
WordPress 5.87.99s41.44ms

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

Thanks to @javiarce for our preview assets, @cbringmann and @mkaz for proof reading this post, @annezazu‘s great copy edits, @priethor for shepherding the process along so helpfully, @youknowriad for helping 🧑‍🚒 with the release, and everybody else who contributed to this release for your wonderful work!

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

Editor Chat Agenda: 18 August 2021

Facilitator and notetaker: @itsjusteileen

This is the agenda for the weekly editor chat scheduled for Wednesday, August 18, 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/..

  • 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:
    • 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, #meeting

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

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

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