Ideas for creating this type of custom portfolio grid

Hi,

I’m building a portfolio website for myself. Would appreciate some help as I’m new to Webflow.

I had an idea to create a portfolio grid of images of my design work (say 25 boxes), but only about 8 would be clickable through to a specific page to read more about that project. The idea is to showcase a wide range of work at a glance, but only highlight a select few case studies (as not every project is worth its own page). The ones that would be clickable would take up more than one box, so it would be a grid with different sizes of boxes. The small squares would still say the name of the project and the client if you hover over, but the bigger rectangles would have a button to click through to the CMS page.

I’ve started making something which you can see in the Webflow link below (and screenshot here), but figuring out how to get this to be responsive on other breakpoints is hurting my head. I may have made this too complicated and there might be an easier way of doing it?

Thanks,
Tom


Here is my site Read-Only: https://preview.webflow.com/preview/tom-oboyle?utm_medium=preview_link&utm_source=designer&utm_content=tom-oboyle&preview=85187386ccd39333646e80bf63124a37&workflow=preview

hi @Tom_O_Boyle there are two techniques how to create responsive grid. You can find more details with two examples in video below.

1 Like

Wow - thank you so much, unbelievably kind! I wasn’t expecting such a detailed answer.

That’s really helped so I will try it out. Makes much more sense when I see it the way you did it.

Cheers!
Tom

1 Like