Improve convenience in setting of auto-grid less than 3 images

Contribute Feature
1

Configurable minimum image count for automatic image grids

I have run into a limitation with the automatic image grid feature.

At the moment, the auto-grid behaviour appears to be controlled by the site setting for auto-grid images, but the actual threshold for when the composer inserts [grid]...[/grid] is still fixed in the frontend code.

The relevant composer logic currently uses a hardcoded value:

const MIN_IMAGES_TO_AUTO_GRID = 3;

So, as far as I can tell, admins currently have a choice between:

What admins can do now Result
Enable auto-grid images Uploads of 3 or more consecutive images are automatically wrapped in [grid]...[/grid]
Disable auto-grid images No automatic grid wrapping
Change the threshold from 3 to another number Not currently available as a site setting

The problem is that 3 is not necessarily the right threshold for every community.

For some sites, automatic grids are useful, but only when users upload a larger batch of images. For example, an admin might want auto-grid to start at 5, 6, 10, or another value, rather than triggering as soon as 3 images are uploaded.

This would be especially useful for communities where users often upload a small number of images inline with explanatory text, but larger galleries should still be compacted into a grid.

Proposed direction

I think this could be improved by adding a configurable site setting for the minimum number of consecutive image uploads before the composer automatically inserts a grid.

Something like:

auto_grid_images_minimum_count

For example:

Setting Example value
enable_auto_grid_images true
auto_grid_images_minimum_count 5

Then auto-grid would still be available, but it would only trigger once the configured threshold is reached.

This keeps the existing behaviour as the default if the new setting defaults to 3, while giving admins more control.

Experimental branch / possible head start

I have made a small experimental branch here in case anyone with more Discourse development experience has time to fork it, clean it up, or carry the idea forward:

image-grid-num-setting branch

The branch is not intended as a polished PR yet. It is more of a starting point showing the intended direction:

  • add a new site setting for the auto-grid minimum image count
  • expose that setting to the client
  • replace the hardcoded MIN_IMAGES_TO_AUTO_GRID = 3 check in the composer upload code with the configured value
  • update the admin setting text so the existing auto-grid wording no longer implies the threshold is always 3
  • add/update frontend specs if needed

The kind of frontend change I had in mind is roughly:

const minImagesToAutoGrid = Number(
  this.siteSettings.auto_grid_images_minimum_count ?? 3
);

if (
  this.siteSettings.enable_auto_grid_images &&
  this.#consecutiveImages?.length >= minImagesToAutoGrid &&
  this.textManipulation
) {
  this.textManipulation.autoGridImages([...this.#consecutiveImages]);
  this.#consecutiveImages.length = 0;
}

There is also a recent example of a Discourse-style enum site setting in PR #36014:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

That PR is for the Calendar and Events plugin rather than image grids directly, so I am not suggesting it affects this feature. I mention it because it seems to show a useful implementation pattern for this sort of configurable site setting: define the setting, expose it to the client, and then read it from the frontend via siteSettings.

Related links

Original discussion about turning off auto-grid images:

Turning off auto-grid-images?

Automatic image grids announcement:

Automatically apply grids to image uploads

Example PR showing site-setting architecture:

PR #36014 - FEATURE: adds calendar_upcoming_events_default_view setting

My experimental branch:

image-grid-num-setting branch

2 Likes
2

Can you share a bit more about your experience in particular?

What is the setting you would use and why?

3

Thanks - yes.

For my site, I would probably set the threshold to 5 images.

The reason is that a lot of posts can naturally contain 3 images without really being a “gallery”. For example, a user might upload:

  • a screenshot of a problem
  • a second screenshot showing the relevant setting/error
  • a third image showing the result or comparison

In that situation, auto-grid applies to consecutive images and helps prevent visual sprawl.

I am also mindful that encouraging lots of image uploads is not ideal for storage or backup size, so I am not trying to push users towards large image-heavy posts. My point is more about layout control when multiple images are already being uploaded.

For me, auto-grid becomes more useful when a post has clearly moved beyond a few explanatory images and into a larger batch of images. Around 5 images feels like a better threshold for that on my site.

So I do not want to disable auto-grid entirely. I like the feature in some cases. The problem is just that the current fixed threshold of 3 is a bit too aggressive for communities where small groups of images are often used as part of an explanation.

That is why I think a site setting such as auto_grid_images_minimum_count would be useful. Sites that like the current behaviour could leave it at 3, while sites like mine could raise it to 5, or 2, or another value.

2 Likes
4

In your specific case, what if instead:

  • auto-grid used the “carousel” layout by default or
  • it were easier for users to “ungrid” the whole group

Another thought is occurring to me now…

Perhaps it’d be worth further separating the concept of an “image group” from the “layout” for that group.

For example, in the rich editor if you could toggle among three options for a group (list, grid, carousel), while leaving them all in the group, perhaps that’d make it easier for users or moderators to pick the preferred layout with a single click, in the cases where the heuristic chosen to pick the default isn’t what they want.

5

Yes, I think that separation makes sense.

In my case, the main issue is not really that grids exist. It is that the current heuristic makes a layout decision quite early, at 3 consecutive images, and then exposes that decision as [grid]...[/grid] markup in the post.

I agree that separating “this is a group of images” from “this group should be displayed as list (no wrap case) / grid (wrap case) / carousel (wrap case with bbcode parameter)” would probably be a cleaner long-term model.

Something like this would make sense to me:

  • the composer recognises or creates an image group, so recognising in the Rich text editor or creating in the Markdown editor.
  • the group has a layout choice: list, grid, or carousel - a parameter to the bbcode.
  • users or moderators can change that layout with one action, which is possible via the 2nd pane in Markdown composer.
  • the post does not depend on users understanding or carefully preserving [grid] tags, which is what the single-pane Rich text editor is useful for.

That would probably solve more cases than just adding a threshold setting, but it’s still a broader feature.

For my specific site, I think I would still choose list as the default for small groups of images, because 3 screenshots are often part of an explanation rather than a gallery. For larger batches, I can see grid or carousel being useful.

So perhaps there are two levels of improvement:

  1. a smaller admin setting / larger user preference for the current behaviour, such as auto_grid_images_minimum_count, preserving the existing default of 3
  2. a richer image-group layout model later, where list/grid/carousel can be changed more easily without editing markup manually. However, i believe this belongs in a different feature request topic.

Though, if the second direction is preferred, then my opening post suggestion about that threshold setting may be less important, but I think the underlying problem is the same: admins and users need a bit more control over when multiple images are treated as a gallery-style block rather than normal inline explanatory images.

1 Like
6

So, yeah, I think the way I’m thinking of it now would be to do the following:

  • when > 1 image is uploaded, wrap in [grid]
    • when count is <=3, make it [grid mode=list] by default
    • when count is > 3 and <=10, make it [grid mode=grid] by default
    • when count is > 10 make it [grid mode=carousel] by default
  • in rich mode and preview, make it easy for the user to toggle between list, grid, and carousel modes

@chapoi and @renato curious for your thoughts here.

1 Like
7

Not convinced. Even in the case of OPs screenshot example. i would like these to be next to eachother.

Im more in favour of the original proposed setting, if anything, than trying to be smart about it, but we should wait until this feature request has any more votes, or we heard the same thing elsewhere, before taking any action.

1 Like