Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Pinterest style portfolio page / scattered images with CSS


giuliomiglietta

Question

Site URL: http://www.giuliomiglietta.com

Hello everybody,

Do you know if there is a CSS way to have a portfolio page using a Pinterest style, staggered image layout?
A bit like what the Matsuya template uses in galleries, with the exception that these should be actual clickable pictures as part of a portfolio page?

I'm using squarespace 7.1 to design my new site and it would be nice to upload images and have them in different ratio on the page.

Thanks a lot!

 

Screen Shot 2021-01-14 at 13.46.14.png

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Posts

Thanks @derricksrandomviews It's really as close as it gets via the gallery method. It's not bad but the link opening is a little clunky and I can see the differences of it not being an actual portfol

Posted Images

4 answers to this question

Recommended Posts

  • 0

If it were 7.0 I could answer this now, because I already do this on my site using summary blocks. The closet thing to what you want is to add a gallery section to a portfolio page (could be a new portfolio page) set the layout to Grid:masonry, Full Bleed which sets different ratios, enable the lightbox function and each image will be clickable. You can also adjust the spacing between images. All those options on one little panel. 

Edited by derricksrandomviews
Link to post
  • 0

Oh, well then use the clickthru Link option for each image. Click the little image icon to open the edit panel and edit each image. There is a link option which will allow you to click thru to anywhere, off site or on site. Just enter the url address  or search for the on site page go want to go to. 

Edited by derricksrandomviews
Link to post
  • 0

Thanks @derricksrandomviews It's really as close as it gets via the gallery method. It's not bad but the link opening is a little clunky and I can see the differences of it not being an actual portfolio page. 

Thanks so much for your help, I'll hold on and see if anybody figured it out via CSS. Someone in a separate post suggeste something to do with Grid-column:span 2 and Grid-row-end:span 2 and autocolumn.
But not much else of the code pasted and not much room to pick the subject back up.

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...