Streaming live at 10am (PST)

Set up a portfolio in a grid and a slider using Webflow CMS

Hey guys,
I am new to webflow and I try to understand it as best as I can.
I want to set up a portfolio for myself. On top of the page I want to have a slider with every picture that is on this side (one side for every category (for example: animals, landscape, etc)).
Below the slider I want to have the single pictures in a grid, like it’s on Instagram.
Three pictures centered with white spaces between.
This is what I did for now:
(The pictures aren’t the one I really want to use later, just for testing).
I am 100% unhappy with the slider, because I don’t know how I can set it up best. If you have any ideas or tutorials, let me know please.
So, I tried to make the grid. Right now, I am using columns with a picture element inside to center. But they aren’t on the same height. How do I center them correctly? And, the size of the image? Yes, for sure, the pixels aren’t the same, but can I scale them automatically in the same size? And how do I set this up for the CMS? That I only have to import more pictures and they get sorted automatically in the grid.
What also would be nice is if the slider automatically gains the pictures from the images in the grid. I think it’s possible with the CMS right? But how?
I know these are a lot of questions and my English isn’t really the best and I hope you can understand my problem(s). But If you have any help for me I apricate it.

Hi Jonalange,

Here a few links that will help you to sort out some of your questions:

For the grid I recommend you to check out Flexbox, you can easily achieve what you are looking for and control the height of the images on your grid:

You can even combine CMS collections and flexbox and that way you’ll have the grid pulling out content directly from the CMS:

Hope these links can help you.

1 Like

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.