WordPress / developer-blog-content

In this GitHub space, WordPress team coordinates content to be published on the Developer Blog. Discussions and montly meetings (first Thu - 13:00 UTC) in WP Slack #core-dev-blog
https://developer.wordpress.org/news
40 stars 5 forks source link

Using Block Inspector sidebar groups #112

Closed bph closed 1 year ago

bph commented 1 year ago

Discussed in https://github.com/WordPress/developer-blog-content/discussions/106

Originally posted by **justintadlock** May 2, 2023 Sometimes, block developers need to add custom color options that are not available as the default Text, Background, and Link color supports, as shown in this screenshot: ![image](https://user-images.githubusercontent.com/1816309/235693287-f7313578-9d35-44ac-99d3-ebb5a39959f0.png) This question pops up from time to time, and it'd be good to have a solid resource on how to accomplish it. I've already written code for this in a plugin of my own: https://github.com/x3p0-dev/x3p0-progress/blob/1.0/resources/js/color/panel-color.js Some things to note: - ~~You cannot add colors to the default "Color" panel. You must build a custom panel.~~ You should be able to add custom colors to the Color panel now. - You can add individual colors to other custom panels.
justintadlock commented 1 year ago

There's a newer (and simpler) way to do this now (note that I haven't tested this method): https://github.com/WordPress/gutenberg/issues/47323#issuecomment-1535587445

@ryanwelcher - This is the tutorial we talked about if you want to pick it up.

ryanwelcher commented 1 year ago

This topic is difficult to dive into fully as all of the components that are required to add custom items to the existing controls are all marked as experimental. This alone may not be an issue but the process of adding a new items is very complicated and requires a lot of explanation. @ndiego and I discussed this today while I was working through how to add a new color and we both felt that it is far too much to get into for this post.

As such, I have focused solely on how to target the different areas to put items into them rather than extending the controls. This make the post quite short and I am questioning it's value a bit.

That being said, I have a first draft in place for this for review here and would love any feedback.

justintadlock commented 1 year ago

I think the change of direction is OK, and it's worth exploring what you have.


@bph - Do we want to split this topic into two separate tickets? Since this has changed, we should probably make sure we're leaving this open for a specific post that covers color options.

bph commented 1 year ago

I read the draft and I think it's great to cover all the places where extenders can add controls.

I support the change in direction.

ryanwelcher commented 1 year ago

I've added a short conclusion and created the preview for second review - https://developer.wordpress.org/news/?p=1465&preview=1&_ppp=7d65c5a2ea

marybaum commented 1 year ago

I've had my way with the copy in the Google doc. See what you think and move the changes you like to the P2!

ryanwelcher commented 1 year ago

Thanks @marybaum! I'll apply those changes today.

bph commented 1 year ago

Pre-publishing checklist:

🙌 Publish! 📗

After-publish checklist

ryanwelcher commented 1 year ago

https://developer.wordpress.org/news/2023/06/using-block-inspector-sidebar-groups/