Smugmug Gallery Style in New Smugmug Needs Attention!

Motorsports · August 1, 2013

OK, firstly well done for all the hard work. I've had fun playing and due to limited time I've unveiled my site now using the Smugmug gallery style which for me, so far at least, works best. This is because I just hate the slideshow page which can't be customised at all (as far as I can see).

The problem I have with the smugmug gallery (which I didn't have in the old smugmug) is that there is so much wasted space under the main photo that captions, keywords etc are all off the bottom of the page which looks really bad. There is also wasted space at the top.

I am using the stretchy option to be consistent with the theme but could this content block please be redeisgned so caption & filename come right under the main photo. I am only using large and am losing stuff off screen.

Or is there a way to avoid this that I'm missing?

GaryBakker · August 1, 2013

As someone who uses the Smugmug style exclusively and has a LOT of captions ... this problem is a high priority one for me!
Gary

Motorsports · August 1, 2013

GaryBakker wrote: »

As someone who uses the Smugmug style exclusively and has a LOT of captions ... this problem is a high priority one for me!
Gary

I agree, for me the captions are very important and belong under the picture. The filename should be shown too as it helps the client and this should be an option - not just to see it when there are no captions.

In my initial rambling post I should have mentioned that I have set all top/bottom margins to tiny so have done the best I can to minimise the problem but its the limitation coming from stretching that's causing this. If I do it fixed it looks nice but is way too small and the max width too small and also not something I'd care to choose without knowing the viewers screen size.

There must be a way to stretch this style width ways to fill the page but not height wise?

Related to this, I do wish the footer block (containing my copyright statement) was fixed at the bottom of the screen so it is visible all the time. Unless the view scrolls way down he is not aware the photos are copyright!

moiraine · August 3, 2013

What resolutions are you guys viewing your sites on? I just viewed a gallery from GaryBakker's site (sorry Motorsports, I wasn't sure where to find your galleries), and the smugmug styles looked beautiful. Captions sat about half an inch from the bottom of the screen and the main image took up about half of the provided screen space in width.

mbonocore · August 3, 2013

Also, in addition to resolution that Moiraine asks for, you can "pin" that's a great suggestion. I will add it to the feedback forum!

Thank you for the kind words as well!

Michael

Motorsports · August 3, 2013

Moraine

Thanks for looking - I was experimenting late last night/early this morning and managed to make it look a bit better. For me the key to solving it was to make sure I had 'fill height off' AND to put a right block of 90px. This seemed to align the captions better with the picture. Without that it was stretched all over the place. Only issue is this is the biggest I can get the photo's without information going off the bottom of the page. The big gap at the top under navigation seems to be something I can't get rid of.

So for the moment I feel relieved. I'd still like a way to brand the slideshow/big view page, accentuate the caption, always show filenames under the images and, as everyone has said, give us back the next/previous button but hopefully such things will become possible soon.

After all, the smugmug template is the 'signature' one so should be the ultimate style.

GaryBakker · August 3, 2013

moiraine wrote: »

What resolutions are you guys viewing your sites on? I just viewed a gallery from GaryBakker's site (sorry Motorsports, I wasn't sure where to find your galleries), and the smugmug styles looked beautiful. Captions sat about half an inch from the bottom of the screen and the main image took up about half of the provided screen space in width.

The Smugmug style isn't too bad with respect to captions if one scrolls down just a little. I still think that there is too much empty space between the bottom of the photo and the rest, but it probably is the same as legacy. I will double check to make sure I have the pixel settings optimized too.

And of course, disappearing comments in the slideshow/lightbox is a much bigger source of discontent.

Motorsports · August 3, 2013

Moraine

Sorry, I forgot to answer your question - I'm using an iMac at 1680 x 1050. Have not been able to view it on other laptops yet.

My effort so far is at http://photos.gridshots.com

krashedmykarch · August 3, 2013

GaryBakker wrote: »

The Smugmug style isn't too bad with respect to captions if one scrolls down just a little. I still think that there is too much empty space between the bottom of the photo and the rest, but it probably is the same as legacy. I will double check to make sure I have the pixel settings optimized too.

And of course, disappearing comments in the slideshow/lightbox is a much bigger source of discontent.

Gary, I've figured out your problem. Too cooped up! Y'all gotta get out more.

moiraine · August 3, 2013

Ahh... it does seem like on the 1650x1080 situation, the smugmug style sizes the main image up a few pixels too soon, but if you view it just on a slightly shorter size, the captions seem to display just fine

GaryBakker · August 3, 2013

krashedmykarch wrote: »

Gary, I've figured out your problem. Too cooped up! Y'all gotta get out more.

But, but ... I love this stuff. I come from a software development background, and I am a perfectionist. :ivar

Let's see, there has got to be at least one more emoticon I could use...

Vanlippe · August 3, 2013

What I find very confusing is how, even with layout controls for margins in many places and for many different content selections, the type of site you start with seems to determine some really fundamental layout differences for the gallery display. Some layouts (like Moss) puts in these really wide borders on the left and right that significantly affect how things are displayed. But there is nothing within the layout that shows how that's accomplished. And, for other layouts (such as starting with the default and putting everything in myself), there is apparently no support for adding separators on either side of the gallery block - so I can change how the content is resized and displayed within the gallery block.

The end result is I either have too much of the browser window's screen real estate used (the problem discussed at the beginning of this thread) - and my titles and descriptions require the user to scroll. Or, starting with a design like Moss - I end up with lots of wasted space - and nothing in the customization would seem to allow me to correct that. And why, if I'm customizing, do some of the "starting designs" - prevent me from removing blocks like "social icons" - or even changing their layout options?

For the moment, I'm sticking with the legacy until I am able to solve more of these issues and at least recreate a design that more closely resembles what I already have.

Vanlippe · August 3, 2013

Well - I partially found the answer to my own question. I was attempting to edit properties of items - like the logo and navigation - from the Homepage. Since those items were set for the entire site, options like layout (and removing them) were not available unless I select "Entire Site".

And - the answer to why "Moss" looks so different is pretty much the same. The settings for "Entire Site" use Fixed for the width instead of Stretchy. While I wish "stretchy" adapted better to screen width and height, using fixed does provide an option that seems to ensure more of the image text is displayed.

alienmuppet · August 3, 2013

I found that at 1600 x 1200 the pictures look a lot smaller on the new smugmug compared to old smugmug, and compared to zenfolio. I may not of explored all of the gallery options so please correct me if I'm wrong:

http://ossl.co.uk/~marks/Screenshots/SmugMugOld1600x1200.png

http://ossl.co.uk/~marks/Screenshots/SmugMugNew1600x1200.png

http://ossl.co.uk/~marks/Screenshots/Zenfolio1600x1200.png

GaryBakker · August 4, 2013

I would love it if I could make the thumbnails smaller, and the current photo larger. And there does seem to be a lot of empty screen real estate.

Empty space is good for a general web design, but when you are in gallery mode the focus should be on the photos.

GaryBakker · August 4, 2013

alienmuppet wrote: »

I found that at 1600 x 1200 the pictures look a lot smaller on the new smugmug compared to old smugmug, and compared to zenfolio. I may not of explored all of the gallery options so please correct me if I'm wrong:

http://ossl.co.uk/~marks/Screenshots/SmugMugOld1600x1200.png

http://ossl.co.uk/~marks/Screenshots/SmugMugNew1600x1200.png

http://ossl.co.uk/~marks/Screenshots/Zenfolio1600x1200.png

Wow. That is a drastic difference.

krashedmykarch · August 5, 2013

GaryBakker wrote: »

But, but ... I love this stuff. I come from a software development background, and I am a perfectionist. :ivar

Let's see, there has got to be at least one more emoticon I could use...

Going thru SM owner's manual index, humour is not listed....that's the prob! You've figured that all out. Good on ya

barb

James_F · August 20, 2013

Possible Breakthrough in Caption Size.
Hey Troops: Check out the third posting from the top in this thread - http://www.dgrin.com/showthread.php?t=239159 - about expanding the captions and tweaking the area under the images in the new Smugmug gallery style in Smugmug design. I played with Allen's code a bit and I think I made some improvement to this caption situation which is also a big deal for me. See http://jamesfarrell.smugmug.com/Site-Pages/The-West-and-Southwest-Parks/GrandTetonNP - and look at some of the images that have longer captions. Better, but not great. A few notes: All of the images were uploaded at 1800x1200 pixels (something about the image size seems to be affecting how these gallery pages behave). I am not showing the share link which I cannot get out of the way of the caption. I only show the image numbers, caption and photo icon link. The keywords are hidden too.

I have absolutely no clue what I am doing. Everything I've done is to plagiarize other's work and add a few pieces of code that I read about in some "how to" CSS web sites. If there's a better way to tackle this, then please chime in.

Allen · August 20, 2013

James_F wrote: »

Hey Troops: Check out the third posting from the top in this thread - http://www.dgrin.com/showthread.php?t=239159 - about expanding the captions and tweaking the area under the images in the new Smugmug gallery style in Smugmug design. I played with Allen's code a bit and I think I made some improvement to this caption situation which is also a big deal for me. See http://jamesfarrell.smugmug.com/Site-Pages/The-West-and-Southwest-Parks/GrandTetonNP - and look at some of the images that have longer captions. Better, but not great. A few notes: All of the images were uploaded at 1800x1200 pixels (something about the image size seems to be affecting how these gallery pages behave). I am not showing the share link which I cannot get out of the way of the caption. I only show the image numbers, caption and photo icon link. The keywords are hidden too.

I have absolutely no clue what I am doing. Everything I've done is to plagiarize other's work and add a few pieces of code that I read about in some "how to" CSS web sites. If there's a better way to tackle this, then please chime in.

I removed mine because something didn't' quite work but don't remember what.

Played with your site CSS and came up with some minor tweaks. Stretched it around and tweaked to
stop text from covering tools icon. Add z-index's so tools icon worked all the time.

.sm-gallery-image-pagination{
position:relative;
float:left;
left:-20px; z-index: 50
}

#sm-gallery .sm-tile-info{
max-width:77%;
text-align:justify;
color:ffffcc;
position:relative;
top:-45px;
left:90px;
position:relative;
z-index:50
}

.sm-gallery-image-tools{
position:relative;
z-index:99
}

I added a feature request describing how they could probably fix this problem.
http://www.dgrin.com/showthread.php?t=239219

James_F · August 20, 2013

Allen wrote: »
I removed mine because something didn't' quite work but don't remember what.

Played with your site CSS and came up with some minor tweaks. Stretched it around and tweaked to
stop text from covering tools icon. Add z-index's so tools icon worked all the time.
.sm-gallery-image-pagination{
position:relative;
float:left;
left:-20px; z-index: 50
}

#sm-gallery .sm-tile-info{
max-width:77%;
text-align:justify;
color:ffffcc;
position:relative;
top:-45px;
left:90px;
position:relative;
z-index:50
}

.sm-gallery-image-tools{
position:relative;
z-index:99
}
I added a feature request describing how they could probably fix this problem.
http://www.dgrin.com/showthread.php?t=239219

Caption Left: 90px; doesn't work ... image caption and image numbers overlap. Needs to be about 125 or so. Otherwise, I don't notice anything different between what I did and what you offered above. Wish I could move those image numbers more to the left. The share link I don't use so I don't care about that.

I wonder if matters what web browser software is being used. I have only Safari and nothing else.

Allen · August 20, 2013

James_F wrote: »

...
I wonder if matters what web browser software is being used. I have only Safari and nothing else.

Might, I'm using Firefox v23.0.1

LPC · August 21, 2013

See here for centering the captions -

http://www.dgrin.com/showthread.php?t=237467&highlight=center+caption

starrynight · August 21, 2013

I agree that the gallery view isn't working in the new smugmug.
1) captions as others have mentioned
2) a next/last for the preview picture so that users can scroll through all the pictures in the gallery
3) the thumbnails -- thumbnails do not update on re-sizing the window unless the the page is re-loaded using a force re-load. Since the thumbnails do not update, changing the page or clicking next page changes the preview image but the thumbnails do not update.
4) bad use of the space, with lots of empty space
5) non-smooth scrolling of the window size, with some window sizes resulting in parts of the screen being cropped in an
6) and a peve -- the old page selection was much more elegant.

GaryBakker · August 21, 2013

a) Is it possible to re-arrange what is underneath the photo (Smugmug gallery style) so the caption is on top of the share button, photo number, info button, download button, etc.?

b) How do I remove the comment fields?

Thanks,
Gary

starrynight · August 21, 2013

"3) the thumbnails -- thumbnails do not update on re-sizing the window unless the the page is re-loaded using a force re-load. Since the thumbnails do not update, changing the page or clicking next page changes the preview image but the thumbnails do not update."

This is the error I consider fatal. I'm surprised to see people using the gallery style because this problem breaks it in my opinion. I'm not absolutely certain that everyone is seeing the issue, though. Here are screenshots showing the issue at my legacy & new smugmug preview (it's not yet unveiled) site: Here's the gallery view in a "wide" window (1268 X 1063). The preview image appears with a 4 X 5 grid of thumbnails.

starrynight · August 21, 2013

Here's the image when the window is resized to 874 X 1019. The same grid appears (still 4 X 5 shrunk down to fit in the smaller window).

starrynight · August 21, 2013

Updating the page (by clicking on the pages) or pressing > on the screen updates the preview image. But, it doesn't update the thumbnails in this new narrower re-sized window. The same 4 X 5 grid of the 20 thumbnails appears regardless of which page of images is purported to be shown (and in spite of the updating preview image).

OK, sorry for the 3 posts, but couldn't figure out a way to attach multiple images to the same post, and the only way to observe this problem on my site (since it isn't unveiled yet) is to use screen shots. But, I've seen the issue in every new smug mug site I've seen that uses the gallery view except one (need to track that one down, but it was a gallery view in which the thumbnails were always a 2 X 4 grid, regardless of the size of the window).

starrynight · August 21, 2013

The problem I describe below -- of thumbnails not updating when the window is re-sized happens at your site:

http://bakkers.smugmug.com/Travelogues/Stockholm-Sweden/i-BMXWTvt

(on a mac using either safari or firefox and on ipad).

GaryBakker wrote: »

a) Is it possible to re-arrange what is underneath the photo (Smugmug gallery style) so the caption is on top of the share button, photo number, info button, download button, etc.?

b) How do I remove the comment fields?

Thanks,
Gary

GaryBakker · August 21, 2013

starrynight wrote: »

The problem I describe below -- of thumbnails not updating when the window is re-sized happens at your site:

http://bakkers.smugmug.com/Travelogues/Stockholm-Sweden/i-BMXWTvt

(on a mac using either safari or firefox and on ipad).

Interesting. I never noticed this problem because I never re-size my window. I'm using Chrome on a Mac and I see the problem exists with that browser too.

Gary

starrynight · August 21, 2013

Thanks much for confirmation that it's not just me! I've been wondering how folks could have been missing this, and I guess not re-sizing would be the answer.

I re-size my windows all the time, so for me it's a huge problem. Not sure I'm unusual in the amount of re-sizing I do or not. Also, the problem arises if you switch from portrait to landscape mode on an iPad.

Re-loading the window (force re-load) does seem to fix the problem, so that's a work around for people who don't re-size windows frequently.

GaryBakker wrote: »

Interesting. I never noticed this problem because I never re-size my window. I'm using Chrome on a Mac and I see the problem exists with that browser too.

Gary

GaryBakker · August 21, 2013

starrynight wrote: »

Also, the problem arises if you switch from portrait to landscape mode on an iPad.

Ahhh. I was wondering how you knew that this was a problem on an iPad. I knew that window re-sizing wasn't possible so I let it slide. I never thought of portrait to landscape mode switching (and vice versa of course).

Like I mentioned, I never re-size windows so that's why I never noticed. I suspect that is why you're the first to see this bug manifest itself.

I'd consider changing gallery styles, but I don't like Journal, and the others are not friendly to captions.

Good detective work on your part!
Gary

Smugmug Gallery Style in New Smugmug Needs Attention!

Comments