Reduce Padding Above and Below Galleria Gallery Images

TBC · 2018-03-07 10:33:24

Once again, I am in need of your expert advice. I cannot seem to find where I can reduce the space above and below my gallery images. I am using Galleria (which I love, by the way).

http://www.bc-fineartphotography.com/ga … timemaine/ is a case in point. My images are 740 on the long edge to accommodate both landscape and portrait images without giving the normal weight to the landscape ones.

I keep missing where I should make the adjustment.

Thanks for any help you can give.

Take care,

Matthew · 2018-03-07 11:06:49

change the aspect ratio of the slideshow.

TBC · 2018-03-08 04:58:45

I redid the template to no avail and had already experimented with aspect ratios, but because our galleries contain both portrait and landscape, as well as the occasional square, I put the aspect ratio to 1:1.

In addiiton, I emptied the Backlight template cache, the browser cache, and with CCleaner, all recalcitrant files that remained on my PC. I even rebooted the PC, all to no avail.

I created a new Galleria template for panos, using a 3:2 ratio and added a colored buffer (canvas size) in Photoshop to make it work, since Backlight doesn't appear to allow me to do a template for real panos. I can live with that, and you can see that there is not a lot of space between the buffer and the body. Those images are 960px x 640px.

http://www.bc-fineartphotography.com/ga … otographs/

In our regular Galleria galleries, the images are 720px on the long edge, far less wide than the panos. You can see from the screen shot that a vertical image has a lot of excess space top and bottom. Logic tells me that this should not be so, given the success with the Galleria pano template. Then again, computers and programs have a mind of their own. I am flummoxed.

. I took the screen shot with the non-body in white to show the excessive space top and bottom.

Any other suggestions? I am sure it is something really dumb, butin spite of all the time I have put into it, it has won!

Many thanks, I hope, and

Take care,

rod barbee · 2018-03-08 06:02:10

I noticed in the other galleria album you posted above (now not available?) that the content width was something like 1092px or so but the images weren't that big.
With a 1:1 ratio and 1000px wide, that means it's 1000px tall too. And with images only, say 700px high, then you get all that extra space.
You could try reducing the content area width in the page template, get it down closer to what your image size is.

So this is kind of a balancing act between with of the content area width, galleria aspect ratio, and image size.

But either way, when a horizontal image comes up in a 1:1 ratio show, there's going to be extra space at the top.
What I've found that helps is to, while you're designing, make the slide show background a different color, just so you can see the actual space the show is taking up.

In addiiton, I emptied the Backlight template cache, the browser cache, and with CCleaner, all recalcitrant files that remained on my PC. I even rebooted the PC, all to no avail.

Since all the Backlight settings are on the web server, running CC Cleaner and rebooting the machine will have no effect on the presentation.

TBC · 2018-03-08 22:41:05

Thanks, Rod. That was what I suspected. And I do know that a landscape image is clearly going to have more space top and bottom. I'll just have to live with the space for the portrait images if I want my content area to be a certain width. You are not crazy on the album and content sizees have changed. All part of my fiddling. And in designing (as shown above) I have used that technique of making some areas a different color to identify their real estate space.

Again, thanks, and

Take care,

Matthew · 2018-03-08 23:32:13

... our galleries contain both portrait and landscape, as well as the occasional square, I put the aspect ratio to 1:1 ...

The simple fact that you're neglecting is that desktop displays are not square; they are wider than they are tall. You should design your slideshows to match the orientation of the viewer's display.

While you keep desktop with a 1:1 aspect ratio, this is the experience I have visiting your site:

If I have the masthead on-screen, the bottom of the image is cut off. So to see the entire image, I must scroll down.

When I center the image in my browser window, I can't see the caption; it's off-screen. Maybe I don't realize the caption is there.

If I do realize the caption is there, and I scroll down to read it, I'm now cutting off the top of the image.

Nothing about this is ideal. Your design is too wide to use a 1:1 aspect ratio on a desktop display. Try 6:4, or 16:9, then use 1:1 on mobile, where your site will typically be viewed with the device held in a vertical orientation.

TBC · 2018-03-09 03:08:47

Matthew, I was coming to that, and am in the process of redoing my images with dark extensions to fit into a 3:2 (6:4) aspect ratio. That way, I can give equal importance to portrait and landscape images.

What do you recommend for a total width? Right now, I am using 1140.

Thanks, and take care,

TBC · 2018-03-09 03:19:46

For the width of 1140, I am creating images 1140 x 760. Before I change my presets, should I adopt something different? Different maximum width? Different height to allow caption and footer to show up?

This is an actual image with the background color added to fool the system.

Thanks again, and

Take care,

Last edited by TBC (2018-03-09 03:54:26)

TBC · 2018-03-09 04:02:39

I think I may have finally found my way to the correct parameters and succeeded. Still, however, would like your rcommendations on dimensions per what I wrote above. I am eliminating the top/bottom buffer.

Thanks, and take care,

rod barbee · 2018-03-09 04:26:18

You know what, I don't seem to be able to do what I'd want do to in this case: make the gallery area narrower.
I tried changing the Main Copy max-width in the page template to 960px but that only affected the copy area, not the gallery area.

In the other album templates: standard album, Theater albums, there is a max-width setting. Not so in in Galleria. So to change width of the slideshow you'd have to change the width of the entire page, not something you'd really want to do.

If you want the footer and/or masthead to show up as well, you're probably going to need to change the aspect ratio of the slideshow along with the image sizes. Even then, depending on the viewer's monitor, they may not show up. But you can't control that.

rod barbee · 2018-03-09 04:46:47

with an 1140px page width and 760px image, I found that an aspect ratio of 7:5 with the slideshow controls set to "inside", I get pretty decent results.

http://pangolin.barbeephoto.com/galleri … o-1-ratio/

The masthead is relatively tall in this design but I can live with people needing to scroll down

TBC · 2018-03-09 04:51:56

Rod,

That confirms what I suspected, and life is, after all, a compromise. I can live with what I have now.

Thanks for trying. I cannot tell you how much I appreciate that and the support that you and Matt give, along with the occasional weighings in of others.

For panoramas, I suspect I am going to have to stick with what I managed, since I Galleria would not allow me to make the height less than a certain amount:

http://www.bc-fineartphotography.com/ga … otographs/

So ... Should I stick to the page width of 1140 and make my images 1140x760? Or should I make the image slightly narrower (less wide) to allow for margins?

Again, thanks!

Take care,

Last edited by TBC (2018-03-09 05:21:29)

rod barbee · 2018-03-09 05:05:50

If the rest of your site is using a page width of 1140, you probably want to stick to that. Otherwise your galleria pages will be narrower than the rest of your site.

Image sizing is up to you, but I think it's probably better that your viewers don't have to scroll down to see a caption. Personally, I'll use smaller images or sacrifice the relative size of the verticals so that doesn't have to happen.

TBC · 2018-03-09 05:23:31

I just edited my previous comment, so ignore it, and you answered my questions above, except for the panoramas, but I believe I also have th answer to that, unless you see another way to have a shallower aspect ratio.

Meanwhile, I'll experiment with the text below the galleries and perhaps a subheader (experimentation on the way here)...

Again, thanks,

Now, back to the salt mines... From my end, it all looks plausable, although I shall redo a few images to conform to my new specs. If you see otherwise, please let me know.

Last edited by TBC (2018-03-09 05:28:43)

rod barbee · 2018-03-09 06:40:38

not sure exactly what you were asking about the panoramas. If they all have the same aspect ratio, use that for the slide show.

johnblaustein · 2018-03-09 09:05:01

Hi Margo,

I've been following this thread with interest because I just went through much of this when creating my own site with Backlight. I, too, struggled with the "horizontal/vertical" issue and how that works with different monitor sizes and shapes.

I had a thought for you which may or may not work. Since you are preparing all of your images in Photoshop anyway, would it work to add the caption to the PS file rather than have Backlight display it? I don't mean that the caption would be directly on the image like your watermark, but below it within "the background color added to fool the system." This might allow viewers to see the caption and the image without scrolling for panos and horizontals. Just a thought...

John

TBC · 2018-03-09 11:52:16

Rod, I'll check again tomorrow and let you know exacly where I previously found a challenge.

Thanks again,

TBC · 2018-03-09 11:54:26

John,

With Rod and Matthew's help, I think I have come up with what is, for me, a viable solution.

For the record, I prepare my images in LR using Jeffrey Friedl's Mogrify to add th double border and watermark. In PS, I just do my Digimarc.

Check out the galleries now, and thya re behaivng much better. I don't haVe to do anything any more in PS except for the Digimarcing.

Thanks for weighing in, and

Take care,

johnblaustein · 2018-03-09 12:08:15

Margo,

I'm glad you found a solution since mine was not relevant. I didn't know about Mogrity... but now I do. Thanks for that.

All of the galleries I clicked on look very good on my desktop (large) monitor.

John

TBC · 2018-03-09 19:25:15

John,

It is actually Mogrify2. Between The Turning Gate and Jeffrey Friedl, I have almost all I need for Lightroom. I did create the watermark image in Photoshop, and as I said before, Digimarc. The latter I do with a batch process of actions I have created along the way, filtering for copyrights of YYYY year and processing them together, opening them up in PS CC when done.

All are HUGE time savers. With our workshops (that's the next site I have to attack), we are more than busy, and since my husband's talents do not go to the computer realm, the less I have to do "by hand" and the more time I can devote to other tasks and to actually get out and photograph! What a conce4pt!

Thank you so much for checking out the galleries and reporting back.

Take care,

johnblaustein · 2018-03-10 01:01:28

Margo,

Not to belabor this, but I checked several galleries on my laptop (14", 1600x900) and they look fine. Unlike the desktop, scrolling is required, but that's just the nature of the beast. The spacing works well. (The Santa Fe gallery reminds me to back there!)

Are you aware that the link to your site--http://www.bc-fineartphotography.com/--goes to your print info page and not the home page? Perhaps that's on purpose, but the home page seems like a better place to start.

Go photograph! What a concept!

John

Community @ The Turning Gate

#1 2018-03-07 10:33:24

Reduce Padding Above and Below Galleria Gallery Images

#2 2018-03-07 11:06:49

Re: Reduce Padding Above and Below Galleria Gallery Images

#3 2018-03-08 04:58:45

Re: Reduce Padding Above and Below Galleria Gallery Images

#4 2018-03-08 06:02:10

Re: Reduce Padding Above and Below Galleria Gallery Images

#5 2018-03-08 22:41:05

Re: Reduce Padding Above and Below Galleria Gallery Images

#6 2018-03-08 23:32:13

Re: Reduce Padding Above and Below Galleria Gallery Images

#7 2018-03-09 03:08:47

Re: Reduce Padding Above and Below Galleria Gallery Images

#8 2018-03-09 03:19:46

Re: Reduce Padding Above and Below Galleria Gallery Images

#9 2018-03-09 04:02:39

Re: Reduce Padding Above and Below Galleria Gallery Images

#10 2018-03-09 04:26:18

Re: Reduce Padding Above and Below Galleria Gallery Images

#11 2018-03-09 04:46:47

Re: Reduce Padding Above and Below Galleria Gallery Images

#12 2018-03-09 04:51:56

Re: Reduce Padding Above and Below Galleria Gallery Images

#13 2018-03-09 05:05:50

Re: Reduce Padding Above and Below Galleria Gallery Images

#14 2018-03-09 05:23:31

Re: Reduce Padding Above and Below Galleria Gallery Images

#15 2018-03-09 06:40:38

Re: Reduce Padding Above and Below Galleria Gallery Images

#16 2018-03-09 09:05:01

Re: Reduce Padding Above and Below Galleria Gallery Images

#17 2018-03-09 11:52:16

Re: Reduce Padding Above and Below Galleria Gallery Images

#18 2018-03-09 11:54:26

Re: Reduce Padding Above and Below Galleria Gallery Images

#19 2018-03-09 12:08:15

Re: Reduce Padding Above and Below Galleria Gallery Images

#20 2018-03-09 19:25:15

Re: Reduce Padding Above and Below Galleria Gallery Images

#21 2018-03-10 01:01:28

Re: Reduce Padding Above and Below Galleria Gallery Images

Board footer