Skip to content

Plugin Directory: Improve screenshot lightbox captions#697

Open
dan-zakirov wants to merge 3 commits into
WordPress:trunkfrom
dan-zakirov:dan/meta-8289-lightbox-caption-animation
Open

Plugin Directory: Improve screenshot lightbox captions#697
dan-zakirov wants to merge 3 commits into
WordPress:trunkfrom
dan-zakirov:dan/meta-8289-lightbox-caption-animation

Conversation

@dan-zakirov

Copy link
Copy Markdown

As part of https://meta.trac.wordpress.org/ticket/8289, this updates screenshot gallery lightbox captions in the Plugin Directory.

Long captions should not cover the image, tall screenshots should stay within the viewport, and short captions should keep the clean centered presentation that works well for most plugins.

Overall, the opened gallery view is improved while keeping the existing Gallery block output, navigation, and image behavior intact.

Case Screenshot Notes
Short caption 01-yoast-seo-one-line-caption Keeps the simple centered caption style
Two line caption 02-accessibility-checker-two-line-caption Shows longer text without covering the image
Long caption 04-accessibility-checker-long-paragraph-caption Covers the main reported case from the ticket
Vertical screenshot 05-accessibility-checker-vertical-caption Checks tall screenshots with captions below the image

Captions stay centered to avoid breaking the presentation for other plugins.

Remove the Photon srcset for Plugin Directory screenshots so replaced assets keep using the ps.w.org URL with its revision query.

Keep the Gallery block, lightbox, layout detection, captions, and reveal behavior unchanged.
Render screenshot captions in an overlay-level bar beneath the active image so long captions no longer cover screenshot content.

Reserve viewport space before revealing captions and keep the core lightbox scale unitless so zoom in and zoom out remain stable for vertical screenshots.

Reduce thumbnail hover repaint work by removing the frosted trigger backdrop in screenshot galleries.
@github-actions

Copy link
Copy Markdown

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Core Committers: Use this line as a base for the props when committing in SVN:

Props alexodiy.

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

- Moved captions into a separate area below the image
- Removed the dark gradient caption overlay from images
- Changed caption text to the standard dark page color
- Reserved caption space before final image sizing
- Kept tall screenshots and long captions within the viewport
- Added a subtle caption reveal animation on lightbox open
- Reduced extra layout recalculations during the opening transition
- Preserved Gallery block output, navigation, image sources, dimensions, layout detection, and cache behavior

Affected: wordpress.org/public_html/wp-content/plugins/gallery-lightbox-enhancements/assets/lightbox-captions.css, wordpress.org/public_html/wp-content/plugins/gallery-lightbox-enhancements/assets/lightbox-captions.js
@dan-zakirov dan-zakirov force-pushed the dan/meta-8289-lightbox-caption-animation branch from 925afa1 to 164c0cf Compare June 14, 2026 21:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant