close
Skip to content

Gallery: Allow gallery to have more columns than total images #55231

@cbirdsong

Description

@cbirdsong

Right now I'm trying to lay out a series of galleries with between two and four images, like this:

### Heading

[ image ] [ image ] [ image ]

### Heading

[ image ] [ image ]

### Heading

[ image ] [ image ] [ image ] [ image ]

### Heading

[ image ] [ image ]

I'd like all the images to be the same size since this is listing out candidates for local elections and we don't want to show favoritism by having one candidate's photo appear larger than the other.

However, I can't set the column value to 4 for all the galleries since the gallery block does not let you set the number of columns to a value larger than the number of images:

A set of headings and gallery blocks with varying numbers of images, all of which have different image sizes1

Currently, it is possible to duplicate a gallery block with four images, remove two of them and end up with markup/block metadata that says there are four columns2:

<!-- wp:gallery {"columns":4,"linkTo":"none"} -->
<figure class="wp-block-gallery has-nested-images columns-4 is-cropped">
<!-- wp:image {"id":56,"aspectRatio":"1","scale":"cover","sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="http://stock.local/wp-content/uploads/2022/01/761eb638-10a7-3784-957b-51c63c28c58c-1024x683.jpg" alt="" class="wp-image-56" style="aspect-ratio:1;object-fit:cover"/></figure>
<!-- /wp:image -->
<!-- /wp:gallery -->

If the input was not restricted then the only change needed to support this would be removing flex-grow: 1; from the stock gallery block CSS.

Footnotes

  1. These are not the actual candidates in the election.

  2. Made a separate issue about this: Gallery block markup/metadata is not updated when images are removed #55232

Metadata

Metadata

Assignees

No one assigned

    Labels

    [Block] GalleryAffects the Gallery Block - used to display groups of images[Type] EnhancementA suggestion for improvement.

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions