Gallery LightBoxes Change Shape with Photos

I’m using Lightbox for my work. However, the different size of pictures I am taking and changing the shape of the light box.

One is round. One is oval. One is a little round. All change shape based on the shape of my photos. In reality I cannot make all my photos the same size without distorting the picture.

How can I keep the Gallery LightBoxes all the same size even though the pictures are different sizes.

Is this a Class that needs to be created? If so, do you have some instructions?



Need help with this exact problem too.

There really is no easy answer to this right now. The best thing you can do is to resize all your photos before importing them in to Blocs. I normally resize my images for landscape and portrait dimensions. I use Photoshop and make a template, then drop my images in to the template. Then export them so they are all the same size.

You could also use another program to create a gallery and just provide a link to it. I do this when I have a larger gallery of photos.

Hopefully when Blocs is opened up to developers (soon) will we see some custom gallery layouts.


I had the same problem with a carousel and there is a fairly simple, albeit tedious solution. Decide on the size you want for your gallery images using a custom class and a background colour, e.g black. Now create a background file of that dimension and colour before dropping the main image on top, so while the visible image shapes might change the real image remains consistent and the arrows stay in place.

The only caveat is that you have to leave enough space around the image to have the arrows show up without covering the image. Ideally, I’d like an option where we can set the width of the arrows and not have them jump around without this step.

In the first image it worked well, but in the second I had arrows covering the main image.



1 Like

Thanks @Flashman another good work around. There will alway be challenges trying to get a portrait photo to look good in a landscape photo. It’s kind of like trying to fit a square peg in a round hole :slight_smile:

Always great to see how others use Blocs.


1 Like

This was a trick I actually employed on the old version of the website, which wasn’t responsive, but had a series of both horizontal and vertical images played as a slideshow within a bordered area. By maintaining a fixed dimension on each file, everything progresses smoothly and the visible image is always centred with seamless transitions.

It really would be good though if we had some means of setting the arrow distance to a specific maximum size, because it would save quite a bit of work outside of Blocs editing the images.