WordPress offers plenty of customization opportunities. If you can dream it, you can likely achieve it. The software allows developers the freedom to experiment.
And WordPress core has continued to evolve. It seems like every major release brings more features to the back end. The Site Editor is a prime example.
Combine these factors and you have a powerful content management system (CMS). And you’ll likely have a messy dashboard as well. There will be layers of navigational items, settings pages, and user interfaces (UI) to absorb.
In all, that’s a lot of clicking, tapping, and swiping for users. The experience has become disjointed and inefficient.
A new feature aims to let users cut through the clutter. The WordPress Command Palette is currently available via the Gutenberg plugin. And it has the potential to significantly boost productivity.
Sound interesting? The WP Minute has the inside scoop on the feature. Keep reading to learn how it works – and when you can expect to see it in WordPress core.
Quick Access to Common Features
The concept behind the WordPress Command Palette is simple. The feature consists of a dialog box that is displayed via a keyboard shortcut (CTRL + K or CMD + K). Enter a prompt and navigate to other areas of your website.
The Command Palette can also perform various tasks. For example, adding a new page. In the Site Editor, the feature provides a quick link to reset a template to its original state.
But the tool goes beyond core WordPress functions. Developers can extend the Command Palette via an API. This would allow a theme or plugin to add relevant functionality.
It opens up a world of possibilities. Imagine being able to change the price of a WooCommerce product without having to edit its post. Or you might display the latest entries from your contact form.
The potential time savings could add up. Suddenly, what used to require dozens of clicks could be reduced to a few keywords.
Command Palette Q&A With Automattic’s Riad Benguella
We’ve established what the early version of the Command Palette does. Now, let’s talk about where the feature is headed.
To help, the WP Minute spoke with Riad Benguella. He’s a WordPress core contributor sponsored by Automattic. He took some time (during WordCamp Europe, no less) to fill us in on some key details.
The following Q&A has been lightly edited for clarity/brevity.
The WP Minute: What inspired the Command Palette?
Riad Benguella: I initially heard about the idea in this post by Matias Ventura. It was mentioned as part of the next iterations to apply to the WP Admin design and experience. It was added to the WordPress Roadmap for 6.3.
I found the feature really compelling as I’m a heavy user of the same feature in code editors (CTRL + SHIFT + P in Visual Studio Code). But there’s also a strong trend on the web and several services are adding a tool like that to navigate and interact. I can cite Notion as one of these tools.
TWPM: Tell us about the Command Palette API. What can developers do with it? And, what challenges did you face in building it?
RB: The feature itself is simple to implement. The main challenge as with most WordPress features is the extensibility. We wanted the panel to be generic, to be easy to integrate across all of (the WordPress admin). And we also wanted to allow both plugins and core to register commands, which can be either static or dynamic (based on the search input).
Also, we wanted to offer the flexibility to register contextual commands and remove or add commands for specific contexts only. For instance, I should only see the “delete template” or “revert template” commands in the Site Editor if a template is actually opened there.
So the challenge was to find the right abstraction that allows these use cases while also connecting properly with the existing WordPress APIs such as the data module (to fetch data).
We ended up building two main abstractions:
- Static commands that can be registered using useCommand React hook or `registerCommand` action.
- Command loaders: you can think of these as callbacks that return a list of dynamic commands based on the search input.
TWPM: What are the next steps for development?
RB: The first iteration is in a good state. The next steps are going to be about adding more and more contextual commands to give users the right commands and suggestions at the right moment.
Right now, the Command Palette is available in the Site Editor and the post editor. But we need to add it to more pages and more contexts to take advantage of its capabilities. For instance, when a block is selected, we may offer contextual commands to manipulate and interact with that block.
TWPM: When do you anticipate the Command Palette becoming part of WordPress core?
RB: It’s going to be included in WordPress in the upcoming 6.3 release. It’s going to be most likely limited to the site and post-editors to start. But I’d expect us to expand that fairly soon after.
TWPM: How do you see the Command Palette evolving in the future?
RB: I’m really excited to see what third-party plugins do with it. (And) if the Command Palette can be a powerful tool for advanced users.
As a developer, I use the Command Palette of Visual Studio Code quite often, so I expect that it will quickly become a handy tool for WordPress experts.
Bringing Order to a Cluttered UI
There’s a lot to like about early iterations of the WordPress Command Palette. It seems destined to become a favorite tool for power users. A hidden gem that helps us get things done faster.
And it will be particularly interesting to see how developers extend the Command Palette’s capabilities. Many established plugins will add custom functionality. But this could also spawn an entirely new category of plugins.
In all, it’s a step forward for the WordPress dashboard. There’s still much work to be done, however.
Here’s hoping for a more unified UI, the integration of a long-awaited notifications API, and a more aesthetically pleasing experience. Both WordPress and its users could benefit greatly from such a makeover.
Editor’s Note: This feature was originally called the ‘Command Center’ and was subsequently renamed.