CMS Gallery tricks in Webflow

[@scape211]

crazy to me this doesn't have more views. The only other lightbox solution I saw was old and used legacy interactions. This is a solid solution until Webflow can find a way to catch up - Thank you!

[@rickpnielsen]

Great lesson Chipp! Worked great. The only thing I did different was instead of adding a page to drop the light-box on, I added it to the page and set the display to "hidden". Works like a charm! Thanks man!

[@ShutterlabCreative]

You're incredibly concise with your direction. Thanks for this.

[@darrelgavino6176]

Hey man this should be on the top of the search list. It really solve my problem. Thanks!

[@didacusjones6253]

Chipp.....please don't stop. Super helpful and i'd say I know a few things about webflow, this I didn't. Thank you

[@stuwenschlag]

Respect! These are seriously great hacks and solutions to vexing problems with creating an image gallery.

[@andrewvaughan3825]

Just wanted to say thank you for this. Super helpful and allowed me to implement a 8-photo preview on each "type" page linking to a gallery page showing all photos.

[@AlexLipscomb]

Wow excellent! Thank you Chipp! And thanks to the user who created the code. This makes a big difference in our work. Thank you!!!

[@TomYakov]

That's a perfect way to do so. Thank you Chipp for this amazing tip!

[@elibogh]

This worked beautifully! Thank you for posting this awesome tutorial.

[@LukeDorny]

What a great solution! In order to avoid having to use justify, you could just add the negative margin to the container or list wrapper. Try that. 👍

[@shanebitzer]

Great Job!! The exact solution I needed. I watch a lot of instructional videos on many different subjects and this was one of the best. It was easy to follow and you answered every question I had along the way. Thanks a bunch!

[@johncurley8015]

Thanks Chipp. Brilliant. Love it. (And those 98K+ emails are a badge of honour) #salute

[@TwoWheelTuxedo]

Thanks for the tip! Sad it took me this long to find you!

[@connormcgregor6740]

great stuff, have been looking for this for ages

[@idreesdigital5552]

Very helpful video. Protip: you don't even need to make a new page for the lightbox. You can put the lightbox on the same page and then set the display to None.

[@melanipetkovic6742]

Thank you. I was looking for this solution for a long time. :)

[@calmingnaturetunes5437]

This is awsome! Is there a way to code some display text when the lightbox is opened (like a small image title and the bottom) taken from a cms collection?

[@AlexRanedo]

Fantastic! Very well done indeed. Thanks for sharing.

[@marlowerecoing-tallen3385]

super new to webflow, making a website for an artist atm, super useful video! any advice on how i could put each different gallery on a different page, without making a dozen different pages or a dozen different cms collections? i would like to show each medium of her art on a seperate page.

[@fredyescape128]

Good Morning Chipp i was wondeing if the gallery you set allows MAKE ZOOM over the images... i would loke to upload HD pictures with the objective that the visitors could make zoom and get closer to watch the details of the pictres... do you think this is possible?

[@mcbair25]

Any way to add in an image description under the enlarged slideshow image?

[@AlphaAdnan]

Absolutely Brilliant!

[@stanislavosipov2838]

Please tell me how to connect cms elements now after the update in webflow. Previously, they were connected by clicking on the gear of an element (for example, text or a picture), but now they are not there 🙏

[@ChippWalters]

Sorry, I haven't used webflow in years.

[@shubhamagarwal4253]

Hey, Quick question. When you justify with space between, it sort of messes up if you have an odd number of projects. (for example 6) the bottom 2 images go to the corners. Do you know a way around this?

[@samsiegel6646]

Wow that was incredibly helpful! Thank you so much :)

[@valopf7866]

Is there the possibilite that the title is shown below the enlarged gallery images?

[@SimonasSileika]

thanks! Great tutorial

[@fnk100]

Hey, is it possible to use Dropdown to choose CMS photo lists (galleries)? Imagine that I could choose a photo gallery related to each month of the year, and each Dropdown / Option Field link represents a month. Thankful!

[@ChippWalters]

Sorry, I don't know. Just try it.

[@fnk100]

@@ChippWalters I'm trying, but I can't. Thank you!

[@schaffan]

Great and to the point. Thanks. How can I add caption to the gallery ?

[@ChippWalters]

Check the webflow forum

[@gdullage]

Hi Chipp, thanks for sharing this. I have asked this on Webflow but I have had no response. How do I have different images for different pages?

[@bruceedwards7626]

Chipp, your video is great and describes exactly what I want to develop for my Website. However, I am new to Webflow and it appears that your video is a bit outdated as menu items on the editor or no longer the same and some options I was not able to find. How would you do this today, 3 years later?

[@ChippWalters]

Sorry, I don't use web flow that much anymore. You might check in the web flow forums.

[@idreesdigital5552]

I just tried it and it's still relevant today.

[@jenniferward6821]

Thanks that’s terrific

[@tylerbeaty]

Hey Chipp, what chrome extension are you using to show the viewport sizing? That's nifty

[@ChippWalters]

It's called Window Resizer

[@tylerbeaty]

@@ChippWalters thanks Chipp! Ordered the Synco Mic D2 a few days back after your recommendation and hearing then go head to head with the mk416s.

[@Youth_Centered_Leadership]

Wow, wow, wow! Thank you so much.

[@kynanbful]

Just what i needed :) Thanks @Chipp Walters

[@OcramSheep]

you save my life bro

[@melanipetkovic6742]

Hi. I followed the instructions multiple times. In my preview mode, I see all the images cropped like it used to be, but when I publish they crop in a strange way and the horizontal space between is gone. Anyone having this problem?

[@ChippWalters]

Check the message on the forums

[@cgdesignsinc]

Hey Chipp, do you have a version of this folks can clone?

[@ChippWalters]

Sorry Chris, I don't.

[@cgdesignsinc]

@@ChippWalters Thanks Chipp, nothing beats a try - great job by the way.

[@AdamMurray88]

You my friend are a champion! Thank you so much, sharing wherever I see this issue on the Webflow forums :)

[@AdamMurray88]

Link for those looking for the page forum.webflow.com/t/full-cms-lightbox/33669

[@ChippWalters]

You're welcome. I actually scoured the forums for this information first and decided there must be others as well who might benefit. Thanks for the kind words.

[@alzibaba]

This is awesome, really fantastic, thank you. I've been hoping Webflow would come up with this sort of solution, but it seems to have gone very quiet on the Webflow CMS Gallery front over past months. I'm wondering if there's a way to make the collection names and filter automatically link to the collections in the CMS so you don't have to copy and paste them manually. I'll see if I can do anything on this when I try putting your solution into action. Thanks a million!

[@ChippWalters]

Glad you liked it!

[@alzibaba]

@@ChippWalters This has worked a dream for me Chipp, thank you. I added a collection for events and then referenced the event name field in the group section of the code snippet. This way I was able to create a symbol for the main image and Lightbox structure, drag the snippet multiple times for different events, then disconnect each from the symbol and filter each one by the event I want. Fantastic solution, Webflow should be paying you ;-)

[@Youth_Centered_Leadership]

Is there any way you can list the steps under the description?

[@ChippWalters]

Sorry, it would take too long and be several pages deep. My suggestion is to request KZbin translate the video and there should be a transcript of it created automatically. Actually, there is an english transcript of it already at KZbin. Just click the 3 little dots.

[@svnbit8408]

@@ChippWalters this method requires background images? I'm wanting to have a faster loading page, thinking I need to take advantage of img src and webflows response auto resizing? Thanks, needing a KZbin lightbox gallery that's not all manually created backgrounds images for each breakpoint. Any advice? Thanks

[@IszyIzzy]

HOw about not including the thumbnails at the bottom. HOw to do that? Help!

[@ChippWalters]

Best bet is to ask at the forum.

[@noweak4993]

Unfortunately don't work :/ the image is not showed :/

[@ChippWalters]

Yeah, that video is years old.

[@MrZxcvbnm22]

Useful. But who really need a gallery like that? I'm now trying to create a basic slider like gallery for an e-commerce and I cant find a way to link it to a multi-image field...

[@ezekielrochat-1]

THANK YOU!!!!!

[@noahploeg]

THANK YOU SO MUCH!!

[@tylerpixel]

Being a webflow designer who is also interested in 3D this video confused me so much 😂

[@ChippWalters]

Yeah, this video is years old. Probably best to look for a newer version.

[@prashantdagar4171]

98000+ emails in your inbox Wtf ??

[@ChippWalters]

Yes, I don't delete them. Just scroll on by 👍