Implement gallery widget

[melchoyce]

Gallery Widget Flow

See https://core.trac.wordpress.org/ticket/41914

[melchoyce]

Wireframes: gallery-widget-wireframes.pdf

Some remaining questions:

• Should we limit the number of columns people can choose in gallery settings?
• If not, should we limit the number of columns shown in the widget within the Customizer widget panel? Should we max out at a specific number of columns, like three or four?
• If someone has a gigantic gallery, should we show all of those images in the Customizer widget panel, or should we max out at a specific number and indicate [+10 more]?

[afercia]

FWIW, not sure the gallery widget should show a preview within the widget box (consider also the Widgets screen in the admin). There's just not enough space 🙂

[melchoyce]

@afercia What about this suggestion?

If someone has a gigantic gallery, should we show all of those images in the Customizer widget panel, or should we max out at a specific number and indicate [+10 more]?

[joyously]

Is there a limitation on how the widget shows the gallery? Or should it be the same as it is in a post? The answer to that might help with the questions about columns.

Does the widget setup have a preview or is it standard media modal that returns parameters (like in shortcode) that are entered into the various widget fields? Within Customizer, it does not need a preview in the control panel because it would be visible in the page preview. Within the Widget page, it does not need a preview either.

I can see that the Media workflow for gallery would be okay for the widget, whereas I feel it is so limiting compared to the old way for Posts. The workflow removed a bunch of options that you now have to add manually to the shortcode if you want them, and it won't even let you create a gallery for attached images. But that works in terms of the widget at least.

[melchoyce]

Is there a limitation on how the widget shows the gallery? Or should it be the same as it is in a post? The answer to that might help with the questions about columns.

As far as I currently know, there's no technical limitations. We might want to artificially create constraints based on what's a better experience, which is what we're trying to determine now as we spec out the widget.

Does the widget setup have a preview or is it standard media modal that returns parameters (like in shortcode) that are entered into the various widget fields? Within Customizer, it does not need a preview in the control panel because it would be visible in the page preview. Within the Widget page, it does not need a preview either.

Like the image widget, it'll rely on the media modal. I disagree that a preview is unnecessary, especially within widgets.php; if you're quickly trying to administer your site, it's helpful to know what images are in the gallery you're looking at, same as in posts and pages.

The workflow removed a bunch of options that you now have to add manually to the shortcode if you want them

Which options? If they make sense in the context of a widget, we could consider adding them.

[afercia]

@melchoyce not sure 🙂 maybe consider first what would be best to show. The actual images or just a representation of the gallery? In the first case, yep I guess there should be a limit since galleries can have dozens of imaged. In the second case, maybe it would be interesting to experiment how a gallery can be visually represented.

[melchoyce]

@afercia We used to show a graphical representation (rather than the images themselves) in posts/pages, and it... really sucked. :) Previewing galleries, versus showing a placeholder graphic, made galleries way, way better to work with IMO.

[westonruter]

@melchoyce @afercia there is some prior work done (by @miina) on such a customizer gallery control with a preview: https://make.xwp.co/2016/08/12/image-gallery-control-for-the-customizer/

A couple screenshots:

[melchoyce]

Trying out some potential configurations:

[melchoyce]

If someone only adds one image to their gallery, let's display it full-width like the regular image widget.

[joyously]

Wouldn't that depend on the other choices they made, such as size (thumbnail, medium)?

[melchoyce]

Sorry, yes. I was trying to say if someone chooses only one image for their gallery, that image should display inside the gallery widget like the image widget, but I communicated that poorly.

[joyously]

Like the image widget, it'll rely on the media modal. I disagree that a preview is unnecessary, especially within widgets.php; if you're quickly trying to administer your site, it's helpful to know what images are in the gallery you're looking at, same as in posts and pages.

I think the media modal is the best preview for widgets.php. Why reinvent?

The workflow removed a bunch of options that you now have to add manually to the shortcode if you want them

Which options? If they make sense in the context of a widget, we could consider adding them.

You can see all the options for the shortcode in the codex. I used to use the orderby date a lot for showing progress on projects or orderby title for the timeline of a vacation (all uploaded at once). I haven't used it much, but it is useful to show the same gallery that is on a particular post by using id.
The one I use the most is one that doesn't work for the widget context, which is leaving off the list of ids so all attached images are shown. This is the part of the modal that is cumbersome to me. I want to set the other parameters (so I don't have to remember the syntax), but I don't want to choose images. But the workflow demands the image choice first, so I was not happy when that hit core. (More "progress" to have to work around.)

[afercia]

@melchoyce the one with a limit to 5 plus themore looks very nice to me. 🙂

[melchoyce]

I think the media modal is the best preview for widgets.php. Why reinvent?

If you have a couple gallery widgets, having a preview to distinguish them from each other is helpful. I also think previewing is always better than abstracting.

[westonruter]

Also take note of parallel work being done in Gutenberg on the gallery block: WordPress/gutenberg#317

[jasmussen]

Nice. In our Gutenberg work, I'm hoping that we can upgrade the existing [gallery] shortcode into a modern block. This remains to be seen whether is feasible or not. But blocks are the end goal here.

How will widgets live in a block world? I know that's an overarching question. But if our gallery is a block, and this widget gallery becomes a block eventually, which one would you use? Not saying that one should necessarily stop the other from being worked on, perhaps they are just slightly different stylistically, and have different names?

[melchoyce]

I don't think widgets will live in a block world — not at the end, at least. I always imagined these media widgets would be a precursor to blocks. When we work towards allowing blocks outside of the_content, widgets will have to become blocks. This gallery widget will have to become your gallery block.

[westonruter]

@jasmussen another way to think of it is that Gallery widget contains a gallery. For the moment it is re-using the gallery shortcode since that is what is in core. But in the future the gallery widget could be a container for a gallery block. A widget can have additional fields beyond just the the main thing it represents, such as the title and then plugins can add additional fields (e.g. Jetpack's Widget Visibility). So I think maybe the way we should perhaps look at widgets is that they could become containers/wrappers for blocks. There could be a generic “block” widget that just instantiates wrappers for each server-side registered block as well.

For the gallery widget specifically, I wanted to highlight the work being done here in relation to Gutenberg specifically to call-out what the data model looks like for the widget/block attributes. The widget and the editor block should both be able to model the same thing and ideally there should be common naming conventions, similarly to how I raised in relation to the image widget and the image block: WordPress/gutenberg#310

If we can use the same schema for the widget/block attributes, then it will make it easier for us down the road to migrate and map between the two.

[jasmussen]

Ah, thank you for the clarification! Makes total sense now.

As a sidenote, I hope my comments did not come over as doubtful of the approach in any way. My trust in this team is absolute, and the project is in great hands.

[westonruter]

The plugin with the Gallery widget auto-deployed to WordPress.org so it is now available for all to test: https://wordpress.org/plugins/wp-core-media-widgets/