Add classes to Widgets in widgets.php and customize.php pages

[alexvorn2]

Add widget base id class to widgets so developers could add custom CSS styles to their custom widgets.

Currently the widgets have only "widget" class and "ui-draggable".

What do you think? I think it's a great idea to highlight custom widgets with different colors, so users can easily find new installed widgets from plugins. (Maybe some one with have other purposes)

[alexvorn2]

like this

[welcher]

I think this could easily become a visual nightmare. Love to get some UI/UX input on this.

[alexvorn2]

Widgets are becoming more and more, we need to do something because finding the new installed widget from a custom plugin - is not so easy.

[welcher]

Perhaps, but if we add a class with the intent of differentiating via colors determined by the plugin author, then we are in the same situation but now all the widget have different colors. So the experience ( in the worst-case ) would be confusing AND ugly.

I certainly like the idea of making it easier to see new widgets, but am not sold on this specific approach.

[JoshuaWold]

We chatted about this in our #design triage. Because Gutenberg Phase 2 is rethinking parts of the WordPress interface, including widgets, it's likely helpful to circle back on this as part of that decision, or after that's been suggested.

At this stage one recommendation is to consider how Custom Gutenberg blocks are being introduced. Many block authors are creating simple icons to go along with their block, to make discoverability easier. That could work here.

[audrasjb]

Hi,

I think it's always a nice thing to add some classes to elements containers. Indeed, it can be used to make things ugly, but that’s the same for each part of WordPress admin.

I believe adding a class that meets the front-end widget class is a best practice that should be encouraged everywhere it's possible. Working on a patch right now.