The WordPress coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. development team builds WordPress! Follow this site for general updates, status reports, and the occasional code debate. There’s lots of ways to contribute:
Found a bugbugA 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.?Create a ticket in the bug tracker.
With WordPress 5.9 bringing support for block themes, this results in a few changes to how the CustomizerCustomizerTool 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. works and how one can preview themes.
At a high level, this post covers how blockBlockBlock is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. themes cannot be previewed due to the introduction of the Site Editor and how the Customizer itself will only appear if a non-block theme is activated or a site has a pluginPluginA plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party that interacts with the Customizer.
Previewing block themes
If you activate a non-block theme like Twenty Twenty-One, open the Customizer, and click on the Change button in the Active theme section, you will see a warning message displayed for each block theme. Please see the example below:
It is displayed because the Customizer doesn’t support block themes. They can be customized in the Site Editor instead.
As a result, to customize a block-based theme, you need to activate it first. If you’re concerned about doing so, it’s recommended that you set up a test site first to explore the theme.
Also, it is not possible to preview inactive block themes because the Site Editor only works with the currently activated block theme. This means that the Live Preview button is not displayed for inactive block themes.
Previewing non-block themes works the same way as in WordPress 5.8. Nothing has changed here.
Customizer and block themes
WordPress removes the Customizer from the Appearance menu if a block theme is enabled. Why? Block themes are customizable within the Site Editor rather than the Customizer.
However, if any callback function is registered for the customize_register action, the Customize menu item will be added. This is necessary to ensure compatibility with plugins that still require the Customizer to be present in the Appearance menu.
Because the Customizer shows up conditionally, various links have been adjusted depending on the type of active theme to ensure a smooth user experience.
For example, if a block theme is activated, the link in the Welcome banner leads to the Site editor. However, if a non-block theme is active, it leads to the Customizer.
Summary
If you need to preview or edit a block theme, activate it first. Previewing non-block themes will continue to work the same way.
WordPress will only add the Customize menu item if a non-block theme is activated or a plugin interacts with the Customizer (please see the customize_register action).
TracTracAn open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress. tickets: #54549 (warning messages for block themes in the Customizer), #54460 (change links depending on the type of active theme), #54337 (conditionally show the Customizer in the Appearance menu).
Props to @annezazu and @hellofromtonya for technical review and proofreading; props to @audrasjb for proofreading; props to @desrosj for providing general feedback on this post.
Remember the blockBlockBlock is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. based Widgets Editor? In case you missed it, this new feature had both a previous call for testing and a merge proposal ahead of WordPress 5.6. After months of hard work, it’s back and better than ever! For a quick refresher, the block based Widgets Editor is an upgrade to the widgetWidgetA WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. areas provided by WordPress through themes, that enables users to add blocks right next to widgets to their headers, footers, sidebars and other widget areas.
Help test this feature
This is a call for testing for the new block based Widgets Editor. Please report your findings on GithubGitHubGitHub is a website that offers online implementation of git repositories that 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/ in the Gutenberg repository as issues or in the comments below. If you have triagetriageThe act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. access, labeling any issue with [Feature] Widgets Screen or [Feature] Widgets Customizer, depending on the issue, would be very helpful. Alternatively, you can simply include “[Widgets Screen]” in the title to help those who can set the labels appropriately. Check out the instructions below for more detailed information.
What’s new?
The most important addition since the last call for testing is that the CustomizerCustomizerTool 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. now supports editing blocks and widgets in widget areas with live preview. Compared to the first iteration of this project, where the widget areas in the Customizer were read only, now you can add widgets and blocks with live preview, scheduling and sharing right from the Customizer.
The main benefit of upgrading the widgets functionality to blocks comes from the ability to directly edit widgets using the familiar block interaction that you use when editing a page or post on your site. Being able to use blocks opens up tons of new creative possibilities, from no-code mini layouts to tapping into the vast library of coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. and 3rd party blocks to create content.
For developers, unlocking blocks in widget areas also offers a core path to upgrade widgets to blocks and get ready for the future. With more aspects of content creation and management moving to blocks, including the upcoming block based theme format, this also helps bring consistency to the user experience.
Is it ready?
This is currently betaBetaA pre-release of software that is given out to a large group of users to trial under real conditions. Beta versions have gone through alpha testing in-house and are generally fairly close in look, feel and function to the final product; however, design changes often occur as part of the process. software and it has a host of known bugs. But it is also intended to be merged into core for the 1st beta of WordPress 5.8. As a merge candidate the goal of the testing is not to discover a bugbugA 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. free feature, but to observe if there are blockers for merging. During WordPress 5.8 beta releases, the bug list will be prioritized ahead of the release candidaterelease candidateOne of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta)..
What to test:
Please keep in mind that it’s recommended that you test this feature on a development siteDevelopment SiteYou can keep a copy of your live site in a separate environment. Maintaining a development site is a good practice that can let you make any changes and test them without affecting the live/production environment. rather than a production siteProduction SiteA 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.. For information about how to set up a development site, please refer to the Setting Up a Development Environment documentation.
– Update channel to “Bleeding edgebleeding edgeThe latest revision of the software, generally in development and often unstable. Also known as trunk.”
– Stream options to “Beta/RCrelease candidateOne of the final stages in the version release cycle, this version signals the potential to be a final release to the public. Also see alpha (beta). only”
You can install the WordPress 5.8 Beta 1 in two ways:
Install and activate the WordPress Beta TesterpluginPluginA 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 (select the “Bleeding edge” channel and “Beta/RC Only” stream).
Install and activate a plugin that provides widgets
Go to Appearance > Widgets
Add some core widgets. For example, Search or Recent Posts.
Add some 3rd party widgets (aka widgets provided by a plugin)
Go to Plugins > Add new
Install and activate the latest version of the GutenbergGutenbergThe Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ plugin
Go to Gutenberg > Experiments
Check “Enable Widgets screen in Customizer”
Go to Appearance > Widgets
Are all the widgets you added there?
Can you customize their settings?
Can you drag and drop widgets to different places?
Go to Appearance > Customize > Widgets
Are all the widgets you added there?
Can you customize their settings?
Adding blocks next to widgets
Be on the latest version of WordPress (5.7.1)
Go to Appearance > Themes
Install and activate a theme that has support for sidebars
Go to Appearance > Widgets
Add some core widgets. For example, Search or Recent Posts.
Go to Plugins > Add new
Install and activate the latest version of the Gutenberg plugin
Go to Gutenberg > Experiments
Check “Enable Widgets screen in Customizer”
Go to Appearance > Widgets
Click the inserter plus button in the top bar
Add some blocks
Do they work?
Save
Are they published on the front end next to the widgets?
Go to Appearance > Customize > Widgets
Click the inserter plus button in the top bar
Add some blocks
Do they work?
Edit some of the block contents
Does the preview update accordingly?
Edit some of the classic widget’s contents
Does the preview update accordingly?
Publish
Are they published on the front end next to the widgets?
Was it intuitive for you to add blocks and third party widgets (ie from other plugins)?
Were you able to properly customize widgets as you wanted?
Did it work using Keyboard only?
Did it work using a screen reader?
For developers:
Make sure to go through the general “How to” documentation available in the Gutenberg codebase for specific instructions.
Test upgrading classic widgets to blocks.
The new block based widget editor introduces a new filterFilterFilters 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. `widgets_to_exclude_from_legacy_widget_block`. It is used to hide widgets that have block equivalents.
We now have a documented way to upgrade widgets to blocks via block transforms.The transform may be added to the legacy widget via typical block extending. This in turn enables users to migrate widgets they already have configured to new block equivalents provided by plugins.
Test enabling and disabling theme support
Test widget areas provided by themes, particularly “dynamic” sidebars, which appear depending on other factors.
Test 3rd party widgets compatibility.
The most common case is for widgets that work in the Customizer but not in the stand alone widgets editor. Previously, developers opted to present the widget UXUXUser experience differently in the widgets screen compared to the Customizer. However, the best practices are preserved in the Customizer.
We’re having an audit of extension points and how well supported they are. Please add missing things that you may find.
Considerations around Opt-in vs Opt-out
Because there is not enough data and stories, a decision has not yet been made on whether the block based Widgets Editor will be opt-out by default or an option for each theme to opt into. Currently, we’re providing the following options for opting out:
The Classic Widgets plugin which allows users to easily opt out of the new blocks in widget areas feature and see the classic widget editor only.
The `widgets-block-editor` theme supports which allows theme authors to opt out of supporting blocks in widget areas. This also reverts WordPress adminadmin(and super admin) to the classic widget editor.
The `gutenberg_use_widgets_block_editor` filter which allows administrators to opt out of supporting blocks in widget areas in cases where this is required. Like the two above, this also reverts WordPress admin to the classic widget editor.
A recent discussion in the Core Editor chat is a good summary on why we’re opting out via a plugin for users. Briefly, it seems to be the cleanest and least prone to maintenance requirements mode possible, versus settings in other plugins or user settings.
This is a difficult decision to make since supporting blocks in widget areas is an important part of the roadmap of WordPress and it will eventually be the default experience. Today, it’s important to determine the impact and significance of the current work on backwards compatibility.
Thank you!
Thank you for helping with testing the new Widgets Editor! Since it is one of the major focuses of WordPress 5.8 any help in this early stage is immensely valuable as it will help determine how viable it is for merging.
Later updates
Monday, May 17th – updated the instruction steps for the user section and added a step to enable the Customizer widgets block editor. This is essential to test the most important addition, adding blocks to widget areas using the Customizer.
Monday, June 14th – updated the instruction steps with newer recommended versions for testing (WordPress 5.8 Beta 1 and Gutenberg Plugin 10.8). Thanks to all the testers and all the feedback below. It was instrumental in advancing the state of the editor, and it’s now better than ever.
GutenbergGutenbergThe Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/’s Full Site Editing project, or FSE, is progressing steadily, and while there’s much more to do, the core roadmap plans for FSE to be introduced into WordPress coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. later in 2020.
With Full Site Editing on the way, what does the future hold for the CustomizerCustomizerTool 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. and for the core Customize component?
At 16:00 UTC Thursday, May 28, we’ll start to tackle this broad question with an hour of discussion in the #core-customize WordPress SlackSlackSlack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/. channel that will include maintainers of the Customize component, members of the Gutenberg team, and you!
The primary focus of the discussion will be about contributing to the Customizer and to Gutenberg, guided by these questions:
First, a recap: What are the goals of the Full Site Editing project?
What can be done in the Customize component to help pave the way in core for Full Site Editing?
How can developers familiar with the Customizer best apply their experience to assist the Gutenberg team?
What’s the best use of time within Customize component for non-Gutenberg tasks? Is it worth patching bugs or pursuing enhancements?
Lastly, we’ll try to leave some time for an open floor.
If you have any questions about this discussion, or if you can’t attend but would like to add something to the agenda, please leave a comment. We’ll get to as many as we can.
In our usability tests with prior releases, we identified two common problems users encountered when trying to create a menu.
Clicking the Add a Menu button in an attempt to add a page to their new menu.
Forgetting to assign the menu to a location.
In WordPress 4.9, we’ve updated the CustomizerCustomizerTool 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.’s menu creation flow to address these issues.
An Updated Menus Panel
The Menus panel layout and copy have been updated for clarity. The panel now shows menus first and locations second. This puts menus front and center and allows the panel to adjust more easily to specific scenarios. For example, when there are no menus, the panel asks users to create a menu and explains the steps to be taken.
Before
After
Menu Creation
When the user clicks Create New Menu, the Customizer opens a dedicated menu creation section. Using a dedicated section allows us to guide the user through each step of menu creation. We start by inviting the user to provide a clear name for the menu and to select its new location. Once the menu is created, we guide them to add menu items and highlight the Add Items button if the user doesn’t find it after a short time.
Create a Menu for a Location
The locations section now allows the user to create a menu for a location that has not been assigned a menu. When the user clicks a location’s Create New Menu link, the Customizer opens the Menu Creation section with the location preselected.
Deprecated UIUIUser interface Classes
With the addition of a dedicated menu creation section, a number of classes are no longer used and are being deprecated.
The following PHPPHPThe web scripting language in which WordPress is primarily architected. WordPress requires PHP 5.6.20 or higher classes have been deprecated along with their files:
The following JSJSJavaScript, a web scripting language typically executed in the browser. Often used for advanced user interfaces and behaviors. class has been deprecated (but not its containing file):
#42116 Customize Menus: Add “It doesn’t look like your site has any menus yet” view
#42357 NewMenuControl class has been removed from trunktrunkA directory in Subversion containing the latest development code in preparation for the next major release cycle. If you are running "trunk", then you are on the latest revision.
WordPress doesn’t help you setup your site according to your goals.
What’s a featured imageFeatured imageA featured image is the main image used on your blog archive page and is pulled when the post or page is shared on social media. The image can be used to display in widget areas on your site or in a summary list of posts.? What’s a headerHeaderThe header of your site is typically the first thing people will experience. The masthead or header art located across the top of your page is part of the look and feel of your website. It can influence a visitor’s opinion about your content and you/ your organization’s brand. It may also look different on different screen sizes. image?
Moving (“dancing”) in and out of panels hunting for what you’re trying to edit is difficult.
Why can I click on one thing to edit it but not another thing?
We need an improved flow for content editing as part of customization that better ties that together with the surface-level tools.
Moving, adding, and deleting chunks of content and “features” in a design should be possible.
What if the customizerCustomizerTool 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. panel is blank, and stuff shows up only when the user clicks something in the preview? Would they be able to do everything they need?
Need a balance of contextual tools and global controls.
How many tickets can we close by iterating on a whole flow?
What are the drawbacks of direct manipulation?
(Direct manipulation = I see it, I tap/click it to edit.)
Focused on what you see in front of you right now, rather than your whole site across multiple screen sizes.
It’s easy to mess up the site layout and design if you can control everything.
This is where “undo” could be handy.
Hard to tell if you’re customizing something locally or something globally.
Should we separate content, layout, and design?
@karmatosed is going to be leading user research and testing:
Have a series of posts on here on make/design asking for input, focusing on how people are using the Customizer to build sites for themselves and for clients.
Have people test the Customizer and report bugs to TracTracAn open source project by Edgewall Software that serves as a bug tracker and project management tool for WordPress..
Frequent Trac triagetriageThe act of evaluating and sorting bug reports, in order to decide priority, severity, and other factors. of Customization component.
Have a public “call for testing” for every new feature or flow iteration. Would be good to integrate these into local WordCamps and meetups as well.
We need to continue working on the technical architecture of the Customizer in preparation for future features and customization flows:
REST APIREST APIThe 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/. for Changesets: #38900.
Bigger features we know we want to support in the future need to be scoped and architected now, while we’re designing, so they’re ready to be implemented later.
I think it’s important to identify the big picture technical stuff, the things we’ll know we need for sure to support implementing the fuzzy design that will come clearer into view. It will take many months to implement. We can’t wait for design to be “finished” before we start development. It needs to be iterative. — @westonruter
Potential wins in the 3 months?:
Merging edited starter content on theme switch: https://core.trac.wordpress.org/ticket/38624.
Pain points with lost widgets and menus when switching themes.
Many of the features and flows we want to build out in the future (drafting changes, revisionsRevisionsThe WordPress revisions system stores a record of each saved draft or published update. The revision system allows you to see what changes were made in each revision by dragging a slider (or using the Next/Previous buttons). The display indicates what has changed in each revision., content blocks) need to be worked on in collaboration with the Editor team.
We also continued the discussion past the meeting time. The conversations were a bit too long to summarize, but you can catch up starting here.
There are three main focuses this year: the REST APIREST APIThe 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/., the editor, and the customizerCustomizerTool 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..
For the REST API we’re going to work on getting first party wp-adminadmin(and super admin) usage of the new endpoints, and hopefully replace all of the coreCoreCore is the set of software required to run WordPress. The Core Development Team builds WordPress. places where we still use admin-ajax.
The editor will endeavour to create a new page and post building experience that makes writing rich posts effortless, and has “blocks” to make it easy what today might take shortcodes, custom HTMLHTMLHyperText Markup Language. The semantic scripting language primarily used for outputting content in web browsers., or “mystery meat” embed discovery.
The customizer will help out the editor at first, then shift to bring those fundamental building blocks into something that could allow customization “outside of the box” of post_content, including sidebars and possibly even an entire theme.
Each focus will have a tech lead, and a design lead, and I’ll be working closely with each to make sure we’re aligned and moving diligently in the right direction even though we don’t have the normal release hooksHooksIn WordPress theme and development, hooks are functions that can be applied to an action or a Filter in WordPress. Actions are functions performed when a certain event occurs in WordPress. Filters allow you to modify certain functions. Arguments used to hook both filters and actions look the same.. These starting leads will be:
REST API: Ryan McCue and KAdam White.
Editor: Matias Ventura and Joen Asmussen.
Customizer: Weston Ruter and Mel Choyce.
Given there is no set timeline for releases that would normally set a term, these leads are free to bow out at any time they feel they can’t contribute fully and we’ll find a replacement.
You might be wondering what each lead is responsible for. The REST team gave some thought to this for their focus, and this is the list they came up with:
Tech Lead responsibilities:
identify and ensure implementation of first-class REST API usage within WP-Admin,
replacing/refactoring admin-ajax use.
overall REST API architecture
infrastructure and endpoint performance
security at an infrastructure and endpoint (data-exposure) level
improving authentication options and documentation
working with the Design Lead to build new, or expand on existing, endpoints
working with the Design Lead to address usability feedback for the infrastructure and endpoints
Design Lead responsibilities:
usability of endpoints for internal or external clients
usability of the infrastructure from the perspective of a APIAPIAn API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. client
working with the Editor and Customizer focus teams to collect requirements and gather feedback
identifying ways to improve the overall experience for folks building clients or consuming endpoints (like documentation)
You must be logged in to post a comment.