Sandip Mondal 7:27 pm on June 10, 2021
Tags: , , ,   

What’s new in Gutenberg 10.8? (9 June)

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 the time has come for a new version! Gutenberg 10.8 focuses on stability and performance, while also introducing enhancements to the Template Editor and enables more design tools for blocks, among many other things!

Performance Improvements

This release puts a focus on performance by providing iterative improvements. For instance, Gutenberg now allows passing of __experimentalLayout to a memo’d object so re-renders are not triggered when layout data doesn’t change. Thanks to this, blocks like BlockList don’t need to re-render so often, optimizing the editor performance.

More 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. Design Tools

To extend the design capabilities of blocks, more design tools have been enabled in this release, including support for font-weight for the heading block and support for custom fonts for the List block. As with other design tools, you can easily configure them in your theme.json file. 

Furthermore, it is now possible to add custom margin and padding to the Navigation link block.

Template Editor Enhancements

Gutenberg 10.8 also introduces a couple of enhancements for the Template Editor for a better user experience. Now, the title area in the Template Editor corresponds to the current post title. Also, the appearance of the template details popover has been enhanced with more detailed information and an improved layout. 

These improvements help users understand what post and template are being edited with a more clear and descriptive interface.

10.8

Enhancements

  • Block Editor:
    • Update Modal styling. (31639)
  • Block Library:
    • Archives Block: Show the label for archives block dropdown. (30527)
    • Audio Block: Add an example preview. (32333)
    • File Block: Add an example preview. (32350)
    • Heading Block: Add support for font-weight. (27639)
    • List Block: Add font family to the list block. (27510)
    • Page list block: Add active page classes. (32134)
    • Site Logo: Use option instead of theme-mod. (32229)
  • Components:
    • BoxControl: Add allowReset option. (32345)
      General Interface:
    • Remove opacity animation on canvas. (32266)
  • Design tools:
    • Add Letter-spacing and enable this for site title and site tagline. (31118)
    • Block Supports: Allow skipping spacing support serialization. (31973)
  • Reusable Block:
    • Add Convert to Regular Blocks button to ellipsis Dropdown. (32310)
  • 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 parsing and retrieve additional data in REST url-details endpoint. (31763)
  • Template Editing Mode:
    • Don’t display snackbar with the Welcome Guide. (32076)
    • Update the appearance of the template details popover. (32042)
    • Update the title area in the template editor. (32037)
  • Block-based 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.:
      • Add preferences menu group label to widgets and customize 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. (32259)
      • Display wide widgets as popovers in Customizer. (31736)
    • Editor:
      • Link to widgets.php instead of themes.php?page=gutenberg-widgets. (32299)

Bug Fixes

  • Block Library:
    • Image Block: Fix image border radius. (32393)
    • List Block: Fix theme.json styles for the core/list block. (32343)
    • Latest Posts: Limit latest posts 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. width to 100%. (32245)
    • Legacy Widget Block:
      • Fix legacy widget block preview 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.. (32300)
      • Fix legacy widget previews. (32260)
    • Search block: Fix vertical alignment of the search button text. (32340)
  • Block Editor:
    • Block Variation Transforms: Make focus style valid CSSCSS Cascading Style Sheets.. (32305)
    • Fixed Random Collapse of Colors Setting Section. (32388)
    • Block Toolbar:
      • Always close the options menu after toggling 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.. (31921)
      • Fix toolbar alignment in widget block editor. (31991)
    • Iframe: Fix embed dimensions with missing wp-embed-responsive class. (32057)
    • Patterns: Fix allowed patterns check. (32376)
  • Block-Based Widgets:
    • Editor:
      • Fix error when saving empty Legacy Widget block. (32359)
      • Assume light theme when editor canvas background color isn’t set. (32477)
    • Customizer:
      • Center the welcome image in the narrow viewport of widgets customizer. (32264)
      • Fix aspect ratio of welcome image. (32302)
      • Fix deselecting block when inspector is opened. (32361)
      • Fix escape key events in customizer closing the editor. (32175)
      • Fix some smaller styling issues and bugs in Widgets Customizer. (32072)
      • Fix creating and replacing legacy widgets in customizer. (32005)
  • Components:
    • SuggestionsList: Try to use a unique “key”. (32344)
    • Update Dropdown’s close-on-blur logic to work inside dialogs. (32133)
  • Editor:
    • Allow non-latin characters in slugs. (32232)
    • Post Preview Button: Prevent saving the post before previewing in locked/read-only mode. (32341)
  • General Interface: Fix overlap of Notices and block toolbar. (32238)
  • Template Editing Mode: Remove metaboxes from template mode. (32315)
  • Fix the layout definition in the template mode. (32425)

Performance

  • Buttons: Move options to constants to avoid unneeded renders. (32356)
  • Experimental Layout: Pass the same object when no data changes. (32380)
  • Navigation: Avoid rerendering when the placeholder does not change. (32357)
  • Update Welcome Guides to use external image URLs. (32026)

Experiments

  • Block Editor:
    • Block Navigation: Try using CSS for indentation with known max indent instead of spacer divs. (32063)
  • Component System:
    • Add missing Divider, Heading type reference in tsconfig. (32104)
    • Adds a new ZStack component. (31613)
    • Adds new ItemGroup and Item components. (30097)
    • Add new BaseField Component. (32250)
    • Fix Shortcut polymorphism. (31555)
    • Promotes the Elevation component to a full export. (31614)
  • Global Styles:
    • Bugfix: Generate classes from preset slugs in the same way (server & client). (32352)
    • Fix Logic to enable custom colors, gradients, and font sizes. (32200)
    • Fix incorrect useCustomUnits import. (32248)
    • Group typographic block supports under a typography key. (32252)
    • Letter spacing should also respect skip serialization flag. (32459)
    • Skip typography serialization. (32444)
  • Full Site Editing:
    • Align block hover and select styles across list view, site editor, select mode. (31277)
    • Alignment styles: Centre blocks using grid not margins. (32231)
    • Avoid duplicate skip-links in WP 5.8+. (32346)
    • Remove now-obsolete get_template_hierarchy(). (32116)
    • Templates: Remove now-obsolete gutenberg_get_template_paths(). (32066)
  • Navigation:
    • Block:
      • Fix css bleed from navigation. (32384)
      • Fix collapsing 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. of Navigation MenuNavigation Menu A theme feature introduced with Version 3.0. WordPress includes an easy to use mechanism for giving various control options to get users to click from one place to another on a site.. (32081)
      • Lock the document from scrolling when the modal is open. (32269)
      • Refactor Navigation block paddings/margins to inherit global styles. (31878)
    • Editor:
      • Allow block attributes passed to block renderer by way of wp_nav_menu. (31911)
      • Hide sidebar when a menu isn’t selected. (32090)
      • Fix the visible widget area toolbar. (32262)
      • Fix block toolbar position after scroll. (32212)
      • Move modal state to ManageLocations component. (32078)
  • Site Editor:
    • Fix broken template part converter modal styles. (32097)
    • Remove title attribute from NavigationItem inside the site-editor. (30744)

Documentation

  • Handbook:
    • Fix broken contributors readme files. (32272)
    • Fix misspelling in the Widgets Block Editor section. (32242)
    • Mark all experimental components in the handbook. (32147)
    • Update the create a block theme tutorial. (31269)
    • Update iOSiOS The operating system used on iPhones and iPads. Simulator device command in ReactReact React is a JavaScript library that makes it easy to reason about, construct, and maintain stateless and stateful user interfaces. https://reactjs.org/. Native documentation. (32383)
  • Packages:
    • Navigation Editor: Augment and improve Nav Editor (and block) documentation. (31891)
    • Components: Fixed documentation for units attribute in Unit Control. (31901)

Code Quality

  • Block Editor:
    • Rich text:
      • Contextual default shortcut removal. (32327)
      • Remove inline display warning. (32013)
    • Colors: Remove __experimentalUseColors hook. (31438)
    • Remove usages of withState from edit-post and editor. (32349)
  • Block Library:
    • List View: Simplify the BlockNavigation component. (31290)
    • Navigation: Simplify htmlHTML HyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers. selector in nav burger menu. (32303)
    • Remove “class=” wrapper to already wrapped attributes. (29214)
    • Query Block: Remove query context leftovers. (32093)
  • Blocks Package: Make getBlockSupport support any lodash path.. (32322)
  • Block Supports: Avoid a PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher Notice when render_block() is called without attributes. (32135)
  • Components:
    • Button: Deprecate isPrimary, isSecondary, isTertiary and isLink props in favour of variant prop. (31713)
    • Combobox: Remove duplicated ComboboxControl component. (32397)
    • Dashicons: Add types to Icon . (32219)
    • Disabled: Add types to Disabled components. (32105)
    • Remove all withNext wrappers. (32205)
    • Rename ViewOwnProps to PolymorphicComponentProps. (32053)
    • Require explicit children prop for all components. (31817)
    • UIUI User interface Context: Delete unused types from context. (32254)
    • UI Popover: Remove unused content property from types definitions. (32049)
  • Compose:
    • Add types to useRefEffect and clipboard 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.. (31603)
    • Add Types to withGlobalEvents as any. (32290)
    • Add types to useWarnOnChange. (32288)
    • Add types to useViewportMatch. (32287)
    • Add types to useDropZone. (32286)
    • Add types to useDragging. (32285)
    • Add types to useThrottle and typecheck useFocusOutside. (32170)
    • Add types to useKeyboardShortcut. (32168)
    • Add types to useResizeObserver and type checking to useIsomorphicLayoutEffect. (32111)
    • Add types to useFocusReturn. (31949)
    • Add types to usePrevious. (31944)
    • Add types to useReducedMotion and useMediaQuery. (31941)
    • Add types to useMergeRefs. (31939)
    • Add test to useMergeRefs for disabling refs + better documentation. (32044)
    • Add types to useDebounce. (32015)
    • Deprecate withState in favor of useState. (32368)
    • Simplify compose function documentation and point to lodash documentation for it. (32324)
  • Global Styles:
    • Avoid enqueuing global styles twice when running on WordPress 5.8. (32372)
  • Keyboard Shortcuts:
    • Multi select: select all: Restore ref callback. (32318)
  • Linting:
    • Fix eslint warnings in the coreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.-data package. (32198)
    • Fix eslint warnings in the edit-navigation package. (32196)
    • Fix eslint warnings in the edit-post package. (32195)
    • Fix eslint warnings in the edit-site package. (32156)
    • Fix eslint warnings in the edit-widgets package. (32155)
    • Fix eslint warnings in the editor package. (32153)
    • Fix eslint warnings in the nux package. (32145)
    • Fix eslint warnings in the rich-text package. (32142)
    • Fix eslint warnings in the reusable-blocks package. (32141)
  • Navigation Editor:
    • Fix React warning. (32165)

Tools

  • Babel presets: Prefix build with node command for Windows environments. (#32258). (32329)
  • Workflow:
    • Limit when workflows run on forks. (32114)
    • Only calculate the compressed size on pull requests when necessary. (32161)
    • Performance Tests Workflow:
      • Polish Bash script. (32284)
      • Run suite atop latest stable major WordPress version. (32244)
      • Use latest WP branchbranch A directory in Subversion. WordPress uses branches to store the latest development code for each major release (3.9, 4.0, etc.). Branches are then updated with code for any minor releases of that branch. Sometimes, a major version of WordPress and its minor versions are collectively referred to as a "branch", such as "the 4.0 branch". for release tests. (32277)
  • End to End Tests:
    • Fix inserting cover block intermittent failure. (32014)
    • Navigation Editor:
      • Fix failing end-to-end tests. (32043)
      • Skip “Change detection” tests. (32151)
    • Move the Query and PostTitle end-to-end tests out of the experimental directory. (31691)
    • Multi select: Add end-to-end test for gruadual select all. (32304)
    • Remove redundant widget 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. endpoint tests. (32298)
    • Skip tests that are failing with the latest WordPress core. (32228)
  • Eslint: Ignore some eslint rules in react-native folders. (32143)

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 10.85.78s42.03ms
Gutenberg 10.76.75s41.96ms
WordPress 5.76.95s42.81ms

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

Thanks, @ntsekouras for managing the release and @priethor for helping and guiding me with the release post.

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

Lara Schenck 6:43 pm on June 10, 2021
Tags: ,   

CSS Chat Agenda: June 10, 2021

This is the agenda for the upcoming CSSCSS Cascading Style Sheets. meeting scheduled for Thursday, June 10, at 5:00 PM EDT. This meeting will be held in the #core-css 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/..

If there’s any topic you’d like to discuss, please leave a comment below!

  • Housekeeping
  • Project Updates
    • Color Scheming (#49999)
    • CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. CSS deprecation path (#53070), Visual 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. Testing (#49606)
    • CSS Audit (#49582) – A check in before removing from weekly agenda
  • Open Floor + CSS Link Share

#agenda, #core-css

Ahmed Chaion 5:46 pm on June 10, 2021
Tags: , ,   

Dev Chat Summary: June 09, 2021

@peterwilsoncc and @desrosj led the weekly meetings of the WordPress CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. team, respectively at 05:00 UTC and 20:00 UTC. Here is the meeting agenda.

Link to 05:00 UTC devchat meeting on the core channel on Slack

Link to 20:00 UTC devchat meeting on the core channel on Slack

Blogblog (versus network, site) Post Highlights

@audrasjb shared the weekly recap of code changes and contributors in the latest issue of A Week In Core: 07 June 2021. Thanks to the 72 (!) people who contributed, the 12 (!!) new contributors, and the 11 💖 core committers who helped land these changes last week.

@annezazu shared Editor team updates on Full Site Editing, 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., Mobile Editor, and Block Based Widgets Editor from their last meeting: Editor Chat Summary: 02 June 2021.

@danfarrow shared CSSCSS Cascading Style Sheets. team updates on Color Scheming, CSS Audit, and CSS Deprecation Path, but click through to the meeting notes for a CSS Trick that you won’t believe! For more information, see CSS chat summary: 03 June 2021.

@priethor shared details on what’s coming up in Gutenberg including final polishes for WordPress 5.8, Widgets Editor, Navigation Editor, Full Site Editing various milestones.

Kudos to @adamsilverstein for publishing the first dev notedev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. of the release covering the addition of WebP support. Click through to learn how WebP helps you, how to create and use WebP images, plans for the future, and some FAQ items.

@chanthaboune announced a new Make/Project site for all-project communications and cross-team collaboration, so drop your email in that subscribe form and stay up-to-date on all the important topics across the WordPress project.

@jorbin shared the dev notesdev note Each important change in WordPress Core is documented in a developers note, (usually called dev note). Good dev notes generally include: a description of the change; the decision that led to this change a description of how developers are supposed to work with that change. Dev notes are published on Make/Core blog during the beta phase of WordPress release cycle. Publishing dev notes is particularly important when plugin/theme authors and WordPress developers need to be aware of those changes.In general, all dev notes are compiled into a Field Guide at the beginning of the release candidate phase. on Bootstrap/Load Changes in 5.8.

@chanthaboune also shared initial designs on a forthcoming News blog design update, its so lovely go check it out.

Blog posts that need feedback

@annezazu has a reminder for us that the current FSE call for testing has one week left until June 16th, so please try crafting a Polished Portfolio.

WordPress 5.8 update

A ‘Big Thank You’ to everyone that helped get everything in order so that 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. 1 could be packaged on time this week! The 5.8 Beta 1 post does not itself need feedback so much as testing from anyone and everyone able to in order to help ensure as smooth a release as possible next month.

Please check the post for details on highlights from the release and links to get you on your way to testing. As it’s still in development, it’s not recommended to run on a production siteProduction Site A production site is a live site online meant to be viewed by your visitors, as opposed to a site that is staged for development or testing. but testing on development and staging servers would be most helpful. The simplest way of testing is to use the beta tester plugin. In terms of ongoing development, WordPress 5.8 now focuses on tasks in the milestone and on regressions (bugs) found during the beta testing cycle.

Our next milestone will be Beta 2 in SIX days on this coming Tuesday, June 15th.

@chaion07 led the final 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. scrubs this past week. The next bug scrub is due to be run on Monday, June 14, 2021, 20:00 UTC.

Components check-in and status updates

  • Plugins: The Requires PHP and Requires at least 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 headers could previously be specified either in the plugin’s main PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher file or in readme.txt as a fallback. This has now changed for WordPress 5.8, only placing them in the plugin’s main PHP file will be supported from now on. Same goes for themes, the Requires PHP and Requires at least headers should be placed in the theme’s style.css file instead of readme.txt. The reason for this change is that any data in readme.txt is meant for the Plugin or Theme Directory only, and not for WordPress core. Core should retrieve all the necessary data from the plugin’s main PHP file or the theme’s style.css file instead. See changeset [51092] and ticketticket Created for both bug reports and feature development on the bug tracker. #48520 for more details. Thanks @afragen for working on this!
  • Help/About: Work will begin this week on the 5.8 About page. Join in on the discussion over on #52775.
  • All other components: No major updates to report.

Open Floor

@webcommsat pointed out on the video content in Matt’s talk at WCEU which would be valuable to re-highlight when those features land too. Additoionally, Abha thanked everyone for the Contribute to WP resources, workshops and discussion areas at WCEU. The content will continue to be available on the site and we are adding new resources submitted. It will help bridge and encourage people to discover Make WordPress materials and the Learn Project.

Props @desrosj for peer review prior to publishing.

#5-8, #dev-chat, #summary

annezazu 8:57 pm on June 9, 2021
Tags: ,   

Core Editor Improvement: Improve your workflow with List View

As blocks increase, patterns emerge, and content creation gets easier, new solutions are needed to make complex content easy to navigate. List View is the latest and greatest to add to your toolbox when it comes to jumping between layers of content and nested blocks. It’s currently visible in the Top Toolbar and will remain open as you navigate through your content. This makes it easy to bounce between the exact pieces of content you want to alter, whether that’s an individual Paragraph 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. at the very end of a post or a Columns block that contains a beautiful selection of products to choose from. Think of it as the ultimate tool to navigate block complexity, select exactly what you need, and easily view all of the blocks that make up your content at once. Better yet, you can toggle it on/off as you need. Check out how it works in action in the video below: 

Video showing someone selecting various blocks with the List View and making changes.

Going a step further, if a block has an ID/anchor set, it’s displayed in List View so it’s easier to distinguish between other blocks and reference as you want. Here’s an example with a portfolio anchor:

While it was originally imagined for the Site Editor where you’re dealing with even more layers of content, it quickly became apparent that the Post Editor would benefit from this tool too and it was incorporated into 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/ 10.7. Keep in mind that more improvements are planned and you’ll have access to this feature in WordPress 5.8, so stay tuned and get excited!

Thank you to @shaunandrews and @cbringmann for helping with this post!

#core-editor-improvement, #gutenberg

Aaron Jorbin 4:55 pm on June 9, 2021
Tags: , ,   

Bootstrap/Load Changes in 5.8

WordPress 5.8 brings some small changes to the Boostrap/Load component.

  • timer_float is a new function that can be used to reliably determine the total time from the start of php execution. See #39163
  • Inline comments were updated to make it clearer in wp-config-sample.php where custom configuration variables should go and wp-load.php to help improve the understanding of error level reporting. See #37199 and #41902
  • Fatal error recovery was updated to not say an email was sent when it was impossible to send the email. See #52560
  • enable_loading_object_cache_dropin is a new 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. to allow disabling of the object cache dropin. See #53322

Thank you to all of the people who contributed to the Bootstrap/Load component in 5.8.

Props to @desrosj for review and edits.

#5-8, #bootstrap-load, #dev-notes

Jeffrey Paul 5:08 pm on June 8, 2021
Tags: , ,   

Dev Chat Agenda for June 9, 2021

Here is the agenda for this week’s developer meetings to occur at the following times: June 9, 2021 at 5:00 UTC and June 9, 2021 at 20:00 UTC.

Blogblog (versus network, site) Post Highlights

5.8 Schedule Review

  • 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. 1 released yesterday, so now in Beta window with Beta 2 in 6 days on Tuesday, June 15th
  • Focus now fully on tasks in the milestone and regressions found in Beta releases
  • Next Beta Scrub before Beta 2 is Monday, June 14th 20:00 UTC
  • RC 1 in 20 days on Tuesday, June 29th
  • 5.8 release in 41 days on Tuesday, July 20th

Components check-in and status updates

  • 5.8 plans and help needed
  • Check-in with each component for status updates.
  • Poll for components that need assistance.

Open Floor

Do you have something to propose for the agenda, or a specific item relevant to the usual agenda items above?

Please leave a comment, and say whether or not you’ll be in the chat, so the group can either give you the floor or bring up your topic for you accordingly.

This meeting happens in the #core channel. To join the meeting, you’ll need an account on the Making WordPress Slack.

#5-8, #agenda, #dev-chat

Jb Audras 10:43 am on June 8, 2021
Tags: , meta2952, meta4514, meta4621,   

A Week in Core – June 7, 2021

Welcome back to a new issue of Week in CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress.. Let’s take a look at what changed on TracTrac An open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. between May 31 and June 7, 2021.

  • 40 commits
  • 72 contributors
  • 53 tickets created
  • 5 tickets reopened
  • 77 tickets closed

Ticketticket Created for both bug reports and feature development on the bug tracker. numbers are based on the Trac timeline for the period above. The following is a summary of commits, organized by component and/or focus.

Code changes

Administration

  • List Tables: Update spacing in action items on small screens – #48546, #47895

Application Passwords

  • Allow enter key to submit profile form – #52849

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

  • Add a type property to allow Core to identify the source of the editor styles – #53175
  • Add the Site Logo block’s server implementation – #53247
  • Load the WP_Theme_JSON_Resolver class in wp-admin/load-styles.php – #53175
  • Package updates for 5.8 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. 1 – #52991
  • Update script versions – #52991
  • Correct some docblocks added in [50836] – #50328, #52620
  • Fix failing block editor test – #53301

Boostrap/Load

  • Add 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. to allow disabling of object cache – #53322
  • Only reference recovery mode email when it can be sent – #52560

Build/Test tools

  • Remove the ::append_to_selector() method from Tests_Theme_wpThemeJson – #52991
  • Use assertSame() in some newly introduced tests – #52482

Bundled Themes

  • Twenty Twenty-One: Check for navigation element before using it – #52773

Coding Standards

  • Extraneous white space at end of line – #51189
  • Simplify a condition in wp-admin/admin-footer.php – #53306
  • Simplify the logic in WP_Widget::get_field_name() and ::get_field_id() – #16773, #52627
  • Use strict comparison in wp-admin/options-media.php – #52627

Comments

  • Escape comment author’s email in the Edit Comment form – #53349
  • Return valid comment reply link if comments are paginated – #51189

Documentation

  • Add a @since note to wp_parse_id_list() and wp_parse_slug_list() about using wp_parse_list() – #52628
  • Correct type for the $widget parameter of the widget_block_content filter – #51566

External Libraries

  • Update the Requests library to version 1.8.1 – #53334

Plugins

  • Make sure Hello Dolly translations are deleted when the 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 is deleted – #52817

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

  • Add ‘delete_widget’ action to delete 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. endpoint – #53289
  • Delete fresh_site option when updating widgets via REST API – #53317
  • Fix delete widget endpoint – #53313
  • Rename the $creating parameter of rest_after_save_widget action to $update – #53317
  • Restore the $creating parameter of rest_after_save_widget action – #53317

Site Health

  • Conditionally run Authorization 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. test – #52642
  • Remove unnecessary function_exists() checks from WP_Site_Health::get_tests() – #52642

Themes

  • Fix 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) issues with controls in themes screen – #52649

TinyMCE

  • Don’t attempt to initialize the same instance twice. Follow up to [51082] – #52133, #52050
  • Fix initialization when the editor is in a postbox by delaying it until document.readyState === 'complete' – #52133, #52050

Upgrade/Install

Users

  • Add user’s 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. to password reset link to ensure login screen matches the language of the email – #34281, #52605, #53321

Widgets

  • Add widget_block_content filter – #51566
  • Add missing actions to widgets block editor – #53288
  • Enable 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. and Nav Menu widgets in Legacy Widget block – #53301
  • Make new WordPress installations use blocks in widget areas instead of widgets – #53324

Props

Thanks to the 72 people who contributed to WordPress Core on Trac last week:

@TimothyBlynJacobs (4), @SergeyBiryukov (3), @nosolosw (3), @isabel_brison (3), @andraganescu (3), @alexstine (3), @costdev (3), @hellofromtonya (2), @sabernhardt (2), @joyously (2), @audrasjb (2), @jorgefilipecosta (2), @justinahinon (1), @jipmoors (1), @westonruter (1), @drebbits.web (1), @afragen (1), @stevenkword (1), @jorbin (1), @lukecarbis (1), @jdgrimes (1), @tamlyn (1), @solarissmoke (1), @5ubliminal (1), @helen (1), @celloexpressions (1), @Mte90 (1), @hellofromTonya (1), @kevin940726 (1), @garrett-eclipse (1), @y_kolev (1), @Clorith (1), @Otshelnik-Fm (1), @JeffPaul (1), @talldanwp (1), @WebDragon (1), @dlh (1), @pbiron (1), @jamil95 (1), @sushmak (1), @stevegrunwell (1), @aliveic (1), @mkdgs (1), @williampatton (1), @aristath (1), @timothyblynjacobs (1), @ocean90 (1), @noisysocks (1), @promz (1), @poena (1), @metalandcoffee (1), @desrosj (1), @patkemper (1), @herrvigg (1), @spikeuk1 (1), @dway (1), @azaozz (1), @notlaura (1), @MrPauloEn (1), @paaggeli (1), @engahmeds3ed (1), @utsav72640 (1), @kapilpaul (1), @jrf (1), @schlessera (1), @mbabker (1), @walbo (1), @reynhartono (1), @Otto42 (1), @arunsathiya (1), @danfarrow (1), and @mukesh27 (1).

Congrats and welcome to our 12 new contributors of the week! @costdev, @5ubliminal, @WebDragon, @sushmak, @mkdgs, @patkemper, @herrvigg, @spikeuk1, @dway, @MrPauloEn, @kapilpaul, and @reynhartono. ♥️

Core committers: @sergeybiryukov (15), @noisysocks (8), @joedolson (4), @youknowriad (3), @jorbin (2), @azaozz (2), @ryelle (2), @ocean90 (1), @johnbillion (1), @peterwilsoncc (1), and @clorith (1).

#5-8, #meta2952, #meta4514, #meta4621, #week-in-core

Francesca Marano 9:34 am on June 8, 2021
Tags: , ,   

Upgrade/Install component meeting agenda for June 8th, 2021

The next meeting is scheduled on Tuesday, June 8th, 2021, at 17:00 UTC and will take place on #core-auto-updates 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 with the following agenda:

  • Triagetriage The act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. of the tickets in the spreadsheet (they all refer to Outcome 1 of the Updater initiative)
  • Status update on the rollback for failed plugin/theme updates
  • Open floor/tickets awaiting review

Got something to propose for the agenda? Please leave a comment below.

#core-auto-updates, #updater, #upgrade-install

Adam Silverstein 8:22 pm on June 7, 2021
Tags: , , ,   

WordPress 5.8 adds WebP support

WebP is a modern image format that provides improved lossless and lossy compression for images on the web. WebP images are around 30% smaller on average than their JPEG or PNG equivalents, resulting in sites that are faster and use less bandwidth. WebP is supported in all modern browsers according to caniuse.

From WordPress version 5.8 forward, you can upload and use WebP images in WordPress like you would a JPEG or PNG image today (as long as your hosting service supports WebP). Switching to the WebP format for your images will improve your site’s performance and your site visitor’s experience. 

How WebP Helps You

WebP images are significantly smaller than their JPEG equivalents, so visitors to your site will see the complete page loaded more quickly. Smaller images take less bandwidth to transmit, and your images still get all of the responsive benefits of srcset and lazy loading by default. Finally, WebP is supported in all major browsers, so most sites can start using them today.

Creating WebP images

Image editing tools support exporting in WebP, or you can also use command line conversion tools or web based tools like Squoosh. Once you save your images as WebP, upload them to WordPress and use them like you would any other image. 

Using WebP images

WebP images work like any other image in WordPress with some small caveats. 

WebP images support lossy and lossless compression, as well as an animated format and support for transparent images. In WordPress, the lossless WebP format is only supported when the hosting server uses Imagick (the PHPPHP The web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher library) until LibGD adds support. In addition, animated and alpha formats are not yet supported for resized images (lossy images are created instead when you upload in these formats).

WebP support in the media library requires that your web server’s image processing library (WordPress supports both Imagick and LibGD) supports the WebP format. Fortunately these libraries have supported WebP for quite a while so support is widely available. If your web server does not support WebP, you will see an error message when you try to upload a WebP image.

If your audience includes a significant number of users on an unsupported browser (IE11 for example), either avoid using WebP images, or  enqueue a browser polyfill.

Plans for the future

The media component team is also exploring the option of having WordPress perform the image format conversion on uploaded images – using WebP as the default output format for sub-sized images. You can track progress and test this feature on the trac ticket. We are also keeping our eyes on even more modern formats like AVIF and JPEGXL that will both improve compression and further reduce resources required for compression.

FAQ

How can I fine tune the compression quality setting used for WebP images?

Developers or plugins can use the wp_editor_set_quality 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. to set the quality setting. The passed mime type enables setting by type, for example:

// Use a quality setting of 75 for WebP images.
function filter_webp_quality( $quality, $mime_type ) {
  if ( 'image/webp' === $mime_type ) {
     return 75;
  }
  return $quality;
}
add_filter( 'wp_editor_set_quality', 'filter_webp_quality', 10, 2 );

What happens if I enable the filter to use WebP sub-sizes, but upload JPEG? Do the sub-sizes have to match the original?

By default, WordPres creates the sub-sized images of the same type as the uploaded file, so uploaded WebP files to get WebP files on your site. If you want to experiment with uploading JPEG and having WordPress auto-convert these to WebP for your sub-sized images, check out this plugin (related trac ticket).

If I use WordPress multisitemultisite Used to describe a WordPress installation with a network of multiple blogs, grouped by sites. This installation type has shared users tables, and creates separate database tables for each blog (wp_posts becomes wp_0_posts). See also network, blog, site, will all my sites work with WebP images?

No. Multisite stores the file types that users are allowed to upload when a site is created. We are working on improving this in #53167. In the meantime, to ensure all existing sites on a networknetwork (versus site, blog) allow WebP files, you can use the site_option filter in a network mu-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 to add webp to the allowed file types for all network sites:

// Ensure all network sites include WebP support.
add_filter(
  'site_option_upload_filetypes',
  function ( $filetypes ) {
    $filetypes = explode( ' ', $filetypes );
    if ( ! in_array( 'webp', $filetypes, true ) ) {
      $filetypes[] = 'webp';
      $filetypes   = implode( ' ', $filetypes );
    }

    return $filetypes;
  }
);

#5-8, #core-images, #dev-notes, #images

Paal Joachim Romdahl 6:59 pm on June 7, 2021
Tags: , , ,   

Editor Chat Agenda: 10 June 2021

Moved to Thursday 10th June same time because of WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. EU.

Facilitator and notetaker: @ajitbohra

This is the agenda for the weekly editor chat scheduled for Thursday, June 10, 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 10.7 final release for WordPress 5.8.
  • WordPress 5.8 project board
  • Help Test the Widgets Editor for WordPress 5.8
  • Monthly Plan for June 2021 and key project updates:
    • 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.
    • Mobile
  • 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