Pro Gallery 3: Columns thumbnail- No row spacing?

@willwood I have downloaded and tried Progallery 3, it’s a nice advancement of the stack. Using the Column thumbnail grid there is an option to set the column spacing, but not for the row. So when the cols stack there is no gap.

Is this an oversight in the settings or am I misunderstanding things?

And if you are taking them, a feature request…

I really like the Regimented grid layout. If it were possible to extend this to include one or two breakpoints, so users can really fine-tune the layout on various screens, that would be great. Thanks.

I’ve added the option of vertical item spacing in the Columns layout today, staged for the next free update. This was working in the Masonry layout, if you needed vertical spacing already.

Both Columns and Masonry layouts (at this point in time) are almost nearly identical. But when web browsers start supporting the new level 3 CSS grid specification next year, you’ll begin to see a noticeable difference in the direction that thumbnail images are displayed in, between Column and Masonry layouts. If you compare the result in Firefox Nightly right now, you’ll see what I mean.

For that reason, this is why both layouts exist, even though they appear at first glance to do the same thing. It’s all work towards future-proofing ProGallery and adding progressive enhancements.

The choice of settings in the Regimented Grid layout has been expanded to this, which will be available in the next update:

So you’ll be able to define up to 4 custom breakpoints (normally mobile, tablet, large tablet and computer). Then control the thumbnail image widths, heights and spacing (gaps) at those 4 breakpoints.

As before, you’ll note that I don’t force you into using pixels for these units of measurement. Because this is a “professional grade” level stack, you have the freedom to use your own units of measurement in the boxes - like rem, em, px, %, vw, vh - whatever you are most happy using. Plus advanced things like calc, or min, max and clamp if you need to do really advanced things with the sizing.

This particular thumbnail layout was added by request of a few users to replace the similar controls in the obsolete Nick Cates Photo stack. It’s called “regimented” , because it lets you strictly lock thumbnail images to a particular aspect ratio. Good to use if your images are different sizes / shapes and you don’t care if they are cropped a bit to fit.

You might want to keep this forum post up, in case you or anybody else has further feature requests for the next update. I can confirm that there are already at least 2 new thumbnail layouts going into the next update, plus a few other minor additions on the todo-list.

3 Likes

I have gone ahead and published this free update today. Hope that’s okay?

  • Added a checkbox option to the Columns and Masonry grid layouts, to enable the Safari ‘will change’ CSS bug fix to be toggled on and off more easily. This setting helps resolve issues of images vanishing in CSS columns, when animation effects are applied to images or the wider page. Applying ‘will-change:transform’ appears to fix this problem in Safari.
  • Expanded the choice of width, height and gap options in the Regimented Grid thumbnail layout, to encompass different breakpoint widths.
  • New ‘Polkadot Grid’ thumbnail layout. Creates a series of circular thumbnail images within a flexbox-style grid.
  • New ‘Strips’ thumbnail layout. This one creates a vertical curtain effect of thumbnails images, which expand wider on mouseover.
  • Fixed an issue, whereby blank images could appear in a Lightcase.js lightbox, if captions contained links.

The 40% promo on ProGallery v3 finishes at the end of 2020, if you still need to buy it:

There’s also a minor update out for ProGallery v2 users tonight.

1 Like

@willwood Thanks so much!

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