How to add commands to the command palette

[bph]

Discussed in #157

^{Originally posted by richtabor August 14, 2023}
We have this resource here, but it's highly technical (as it should be).

I think having a guide with a few types of commands would be nice. Like a command to toggle on a block editor preference, go to an external help guide article, open a plugin sidebar, etc. Even commands to open up internal admin pages; like a host adding a command to view hosting config, or builders adding a command to open another plugin's admin page, etc.

Not only to show how, but give ideas on what folks can add commands for. Inspire a bit.

It doesn't have to be complex, perhaps simple like how we write about block style variations.

What's the easiest way for existing plugins to add commands to the command palette?

[justintadlock]

I'm going to pick this one up.

[bph]

Thank you @justintadlock for stepping up to the plate! 👏

[justintadlock]

I think, at least for now, I'm going to stick with the basics as outlined by @richtabor in the topic proposal with registercommand/useCommand. I thought about diving more deeply with dynamic commands, but I think an intro to add some basic commands would be a great start because there is currently no easy, plug-and-play documentation for this at all (the linked Dev Note doesn't really teach much and will break just plugging it in).

If we want to follow this up with a more advanced tutorial, we can always do a part 2.

[justintadlock]

Test repo here: https://github.com/justintadlock/dev-blog-command-palette-api

[justintadlock]

Google Doc where I'll draft this tutorial: https://docs.google.com/document/d/1NJDxYNzafY8Dxk-ASh_PlgjRIcjbxAKUWykYts4ywPs/edit?usp=sharing

[justintadlock]

This draft is now ready for review: https://docs.google.com/document/d/1NJDxYNzafY8Dxk-ASh_PlgjRIcjbxAKUWykYts4ywPs/edit?usp=sharing

[bph]

@justintadlock It's a great introduction to the Commands API! Thank you! I test all examples. Apart from the missing build step, everything was working as 'advertised' :-) See my comment in the Google Doc.

[justintadlock]

Published!

Social Copy:

Have you ever wanted to add custom commands to the WordPress Command Palette? Get started with this tutorial on the Developer Blog:

https://developer.wordpress.org/news/2023/11/getting-started-with-the-command-palette-api/

[bph]

Didn't test this before, but I just opened the site editor with the command palette plugin activated and ran into an error:

The code in question:

			return select( 'core/edit-post' ).isEditorPanelEnabled( 
				'discussion-panel' 
			);```

[justintadlock]

Ah, it looks like that's an issue on the Site Editor when accessing that via the hook. I didn't think to test it there since the normal action function works.

Anyway, it's corrected in the post with a check for undefined !== wp.editPost since it's only run on the post editor.

[ndiego]

Social post scheduled.