We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

Question about lightbox

December 3, 2023 at 12:01 pm #11241

[anonymous]

Hello there and thank you all for this really great software 🙂

I have a small question about a problem I have on my WIP website:

I bought the Editorial theme and I would like to add a lightbox for the featured images of a post (like this one)

How could I do that? I don’t really care if it could be a lightbox for every images on the website, it’s even better! I only want visitors to be able to see all the images in their full size.

Thank you very much!

December 4, 2023 at 10:09 pm #11258

[anonymous]

The link changed and I can’t edit my post so I’m putting it here.

Thanks!

December 22, 2023 at 4:42 am #11369
[anonymous]
Hi Kalistia!

My suggestion would be to add an existing Javascript library for lightboxes. Here are some libraries that I found via a quick Google search:
- Pure JS Lightbox: https://pure-js-lightbox.com/
- GLightbox: https://biati-digital.github.io/glightbox/
- Photoswipe (may already be available in Publii): https://photoswipe.com/
- https://forum.bootstrapstudio.io/t/do-you-have-a-favorite-vanilla-javascript-lightbox/10218/5
Look for instructions that provide code that can be added to your head HTML, and allow you to easily add class names to the images that you’d like to turn into lightboxes (example).

Otherwise, the easiest alternative is to insert a gallery with a single column, and add the image that you’d like people to be able to expand. Lightboxes are already implemented in gallery images via Photoswipe on some (if not all?) themes.