Skip to content

Gallery lightbox: clicking the expanded image should not close the dialog when navigation is enabled #78869

@JosVelasco

Description

@JosVelasco

Description

What problem does this address?

When the lightbox is open in a gallery, clicking or tapping anywhere on the overlay — including directly on the expanded image — closes it. For a standalone image without navigation, this is a reasonable affordance, and clicking the image to dismiss is consistent with how the feature was originally designed.

The problem is specific to galleries. WordPress 7.0 introduced lightbox navigation for the Gallery block (PR #62906), adding dedicated Previous and Next controls. With those controls in place, the image-click-to-close behavior becomes a source of unexpected dismissals.

On touch devices, the impact is significant. As raised in #77545, hover is not available on touch — the only visible controls when a lightbox is open are the navigation buttons. A user tapping the image to inspect detail, or slightly mis-tapping while reaching for a navigation button, dismisses the lightbox and loses their place in the gallery.
There is no recovery other than reopening and navigating back.

The behavior was never explicitly discussed in the gallery lightbox PR (#62906). It was inherited from the single image implementation without being re-evaluated in the context of a navigable gallery — where the user's intent when touching the image is to look, not to dismiss.

This connects to a broader concern raised in #55513 by @afercia: the image being an interactive element produces unexpected interactions. When navigation is present, the case for the image as a dismiss target is weakest: the Close button is always visible, Escape always works, swipe gestures navigate, and clicking the background area outside the image already closes the dialog.

Expected behavior

In a gallery lightbox with navigation controls, clicking or tapping the image should have no effect. The dialog should close only by clicking the Close button, pressing the Escape key, or clicking the background outside the image.

For a standalone image lightbox without navigation, the existing behavior can remain unchanged.

Step-by-step reproduction instructions

  1. Add a Gallery block with two or more images and lightbox enabled.
  2. Click an image to open the lightbox.
  3. Click or tap directly on the expanded image.

The lightbox closes. Expected: nothing happens.

Screenshots, screen recording, code snippet

Current:

current.mp4

Proposed:

proposed.mp4

Environment info

WordPress 7.0 + Gutenberg 23.2.2.

Please confirm that you have searched existing issues in the repo.

  • Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

  • Yes

Please confirm which theme type you used for testing.

  • Block
  • Classic
  • Hybrid (e.g. classic with theme.json)
  • Not sure

Metadata

Metadata

Labels

[Block] GalleryAffects the Gallery Block - used to display groups of images[Status] In ProgressTracking issues with work in progress[Type] BugAn existing feature does not function as intended

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