This has been disabled as of 2023-09-25T16:00:00Z
We have enabled the experimental setting
enable_experimental_lightbox on Meta. This is part of our ongoing efforts to improve your user experience and introduce new features.
The Discourse Lightbox is a new feature we’re testing that aims to enhance the way images are displayed on the forum. This change is also part of our migration away from the Magnific Popup, and therefore jQuery.
(For more details, please visit Discourse Lightbox - Migrating away from Magnific popup)
The new lightbox supports keyboard shortcuts for common actions such as:
- M fullscreen mode
- R rotate image
- A open/close carousel
- Z zoom in/out
- D download image
- T open image in new tab
- → / ↓ next image
- ← / ↑ previous image
- Esc close lightbox
And here are some of the reasons why we are moving away from Magnific Popup:
- It has jQuery as a dependency
- It contains code meant for ancient browsers
- The average device used to access the web has changed a lot since then
- It was designed with something other than single-page applications like Discourse as a priority - namely, static pages.
How you can help us
We’d love to hear your feedback on this new feature. If you’re an admin and would like to try it out on your forum, you can turn on the
enable_experimental_lightbox setting. Please share your experiences, report any bugs, or provide any suggestions in this announcement topic. We will be collecting feedback until the end of September.
Our goal is to make this experimental feature the standard in October.
Thank you for your participation and for helping us make Discourse better!
Looks amazing, and those keybind are super helpful, great work!
I’ve been playing around with it for a bit now. I was expecting a swipe down/up gesture to close out of the image, bht it kept scrolling on the page, I had to long press to close it. Is this intentional or a missing feature?
Is there a topic somewhere with lots of quality images to see this in action?
If not is there a suitable category for me to upload some myself?
Maybe the images in Introducing image grids in posts fit your needs.
Is there a setting for the carousel?
It seems to be static.
Here are some (cc licensed) images folks can use to try out the lightbox within this topic.
That Pets of Discourse topic looks like it could use some canine reinforcements.
This has been disabled on meta. We’ll be making some improvements.
clearly the issue is not enough dog photos.
We can neither confirm nor deny this statement
By any chance are the issues with the lightbox related to images not loading? I’ve been using the experimental version since it was released without issue, then I upgraded to latest yesterday and suddenly two users have issues with images not loading in the lightbox. You can follow the saga here: large view when clicking on images - Site Support - Nature Photographers Network
We’ve not seen this issue so far.
One thing to note is that the lightbox changes are only on the frontend. The 403 errors look like authorisation issues. Have you made any changes to your CDN recently?
This new lightbox is still experimental, and to be transparent, we’ll likely not see changes in the next couple of months, so if issues continue to persist, please consider turning it off.
Thanks Natalie, I have not made any changes on my CDN, the only thing I did was upgrade to latest. I turned off the new lightbox this morning and the user no longer has the issue, so it’s definitely an issue with the new lightbox and/or changes made in core recently. Also, after this update the download button disappeared in the new lightbox
Weird, I do still see it on my local and a hosted instance. Is this for every user? Could you check if the button is there or is it just the vector (svg)?
If you can get any more information about that user issue (e.g. one or more images in the post, which browsers and the browser versions) that would help us a lot!
It is weird, no shortage of that for me today I actually don’t see the download button myself:
This is in safe mode so there is definitely no css hiding it or anything…