Lightbox Thumbnails Sizing, Layout, and Captions

Is there a way to change the layout and size of Lightbox thumbnails? If I have more than 5 or so images, the thumbnails are so small!

Screen Shot 2020-07-23 at 7.23.59 PM|690x108

I saw a different post where someone created different wrappers, but I am working on a project template which has other lightboxes, and already completed most of it. The multiple wrappers seemed complicated. Is there a simpler way?

Also, I’ve searched the forums for providing captions on Lightbox images. The last I could find was from July 2019. We are now in July 2020. Has this feature been implemented? I’d really like to incorporate captions into my designs. Let me know if you need my read-only link.

I’m wondering if there is also a way to have images in a rich text block be inline-block, rather than having to span the whole width of the container? Rich text blocks don’t seem to be all that customizable. It’s just starting to get complicated, too, when the templates aren’t 100 percent identical to each other. And I run out of adding fields. I also produce collections to reference, and set a conditional visibility, but some don’t seem to work! Really wish there was an easier way to do all this.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi @chickenlegs0809!

Your read-only link would be helpful to know exactly what you’re working with. I’d be happy to take a look at the lightbox issue.

Hi, Thanks for your response and offering to help. I have fixed the sizing issue, but are you able to help with Captions on a lightbox?

Here is my read-only link.

Thanks!

It looks like there used to be an option to add caption in the Designer based on this link Lightbox | Webflow University

From what I can tell, the caption option is not there anymore. You could build a custom lightbox using interactions. I don’t see any recent tutorials that could guide you through how to do that though. Any tips @WebflowCommunityTeam?

There is a caption option for manual picture lightbox as I have used it.
What there doesnt seem to be is an option to populate it when using cms.
https://wishlist.webflow.com/ideas/WEBFLOW-I-2158

1 Like

That is really unfortunate. Is there no workaround for this? I’ve seen plenty of people ask for this since at least a year ago. And, will Webflow incorporate this feature in the near future, I hope?

What about in-line images in Rich Text Elements? Project templates aren’t super easy to work with when each client case study has varying numbers of photos and dynamic to each section…

Thanks,
Nada

Getting a feel of old tutorials that a lot of their efforts have been getting the interface right and making the product rock solid.
I agree on that principle, if the backend is poor no end off tweaking the pretty stuff will make up for it.
I do feel however that a big update is coming and a lot of these minor end element tweaks should be resolved.

I am learning about rich text myself and I think once you have formatted all the elements they can use its a good option. You can also give limits I think.

1 Like

My sizing issue got all messed up again. I’m not sure what happened and I’ve tried varying solutions. Could you help? Also, do you know how to make each of the thumbnails the same size/height? That’s really what’s causing this mess lol.
Here is my read-only link
The page I am editing is the Project Collections - Project Comps Template.

The thing is, too, that if I add a combo class to one of the collection lists or items, it will do so across all the other page templates, too. I do not want that. This is what’s frustrating about CMS collections and templates!

UPDATE: I’ve decided to just limit my displayed images to two to three, but now when I view on smaller screen size, the images get squeezed. I tried changing the limits on device-widths, but it applies to ALL device-widths. Any suggestions?

I sent this to Blake, too, but if you are also available to help, that would be great! Please read my comment above regarding sizing issues. :slight_smile:

Think this is it for thumbs.
Click a thumbnail image, settings tab, under image settings there is a width and height which are set to auto, change it to like 200 200

That worked. Thank you! I was doing it in the actual style panel, which did not work and was wondering why.

1 Like

Are you able to help regarding this topic?

Hi Blake, are you able to help regarding this topic?