CMS Image Gallery: Same Size and Order Chronologically

Hello.
First post and hoping to get some CMS help as I’m having trouble figuring this out.
I’ve uploaded a CMS Portfolio Gallery with 90+ individual items and the images are unfortunately different sizes. How can I have the CMS auto-populate without having to go in and manually fix 700+ images into the same size? My Image Divs are all the same size and I’ve tried the “Cover” setting but the images are all still different sizes.

Secondly, how can I have the CMS populate each item chronologically? I’ve included year for each item. Is there a way I can have the CMS sort it by year (from most current), without having to manually go in and enter the order for 90+ items? Right now it seems to be populating by the date the item was created.

Here’s the gallery I’m working on:
https://sdw-da3db3.webflow.io/gallery

Your help is much appreciated and if you could be clear in your how-tos would be helpful. I am a relative Webflow newbie and still learning the program.

Thank you in advance,
Sophie


Here is my public share link: Projects
(how to access public share link)

Hi Sophie! You can filter by the year date. Check out this Webflow university page. You’re looking for the sort order setting for your cms collection list. Just set that to sort the field that contains your year, and you’re good to go!

Unfortunately, there’s not a lot of advice I can give on your images without a public share link. But if I were to take a stab at the dark, you might need to set the height and width of the div blocks.

I will take a look at that page. I’ve included the Gallery link… can you not see or access it?
I’m not really sure which sizes to set the div blocks to, so not the affect the responsiveness. Would you suggest setting it in % instead of actual pixel size?
Thank you so much for your reply.

I could see your website, it looks good btw!

To see your website in the designer though you have to share your public share link:

If you want perfectly square images, this is a method that I used recently.

oh got it. here’s the public share link:
https://preview.webflow.com/preview/sdw-da3db3?utm_medium=preview_link&utm_source=designer&utm_content=sdw-da3db3&preview=2b1f03f58a7aec46c80a8de2e42bad6f&pageId=6489457d8bfc729866f63a89&workflow=preview

I’m going to try the image method you sent now. Thank you!!!

1 Like

Let me know if it works!