Want gallery style like Denise... 4 small thumbs

[jenswrens]

I want to find out how I can force my galleries that are set to smugmug viewing style to only have 4 little thumbnails on the left side, similar to what Denise Goldberg has done for most of her galleries: http://www.denisegoldberg.com/gallery/6922094_mjKko#442985738_iXvAy

Mine are set to stretchy, which I want, but my galleries always seem to have 5 little thumbs on the left - I want less. How can I do that? Ideally, I'd want less thumbs so that the photo on the right can be displayed larger, but I don't know if that can be done.

http://jenswrens.smugmug.com

[denisegoldberg]

I want to find out how I can force my galleries that are set to smugmug viewing style to only have 4 little thumbnails on the left side, similar to what Denise Goldberg has done for most of her galleries: http://www.denisegoldberg.com/gallery/6922094_mjKko#442985738_iXvAy

That's just a regular stretchy smugmug-style gallery. The number of thumbs shown will depend on the size of your browser window - unfortunately that isn't under your control. I'd love to be able to specify a maximum width for the thumbs side of smugmug-style gallerires because I'd also prefer larger photos on the right. If only...

I did change the margins a little though because I wanted a little white space on the sides. I used this CSS to adjust the width:
#smugmug #photos,
#smugmug #albumNav_top,
#smugmug #albumDescription,
#smugmug #breadCrumbTrail,
.smugmug #header,
.smugmug #footer {
margin-left: 50px !important;
margin-right: 50px !important;
}

--- Denise

[jenswrens]

:clap Thanks Denise! I suppose it was the white space that I was visually attracted to on your site - not necessarily the number of thumbs. (Although would still like the photo bigger too - oh well.)

How can I apply that code to just certain galleries? Or is it an all or nothin' thing?


That's just a regular stretchy smugmug-style gallery. The number of thumbs shown will depend on the size of your browser window - unfortunately that isn't under your control. I'd love to be able to specify a maximum width for the thumbs side of smugmug-style gallerires because I'd also prefer larger photos on the right. If only...

I did change the margins a little though because I wanted a little white space on the sides. I used this CSS to adjust the width:
#smugmug #photos,
#smugmug #albumNav_top,
#smugmug #albumDescription,
#smugmug #breadCrumbTrail,
.smugmug #header,
.smugmug #footer {
margin-left: 50px !important;
margin-right: 50px !important;
}

--- Denise

[402photography.com]

:clap Thanks Denise! I suppose it was the white space that I was visually attracted to on your site - not necessarily the number of thumbs. (Although would still like the photo bigger too - oh well.)

How can I apply that code to just certain galleries? Or is it an all or nothin' thing?

Hi Denise. I am not sure if you are notified of additional questions to your answers. I hope so! I love the way your galleries are set up.
http://www.denisegoldberg.com/gallery/4858054_Wc4v4


I know you mentioned that they are set to stretch. On my 24" Imac, they look wonderful!!

If you get a chance, can you tell me what I need to do to get my galleries on this page (link below) to be bigger (exactly like yours)? They thumbs are small and the bold text doesn't seem to fit:

http://402photography.smugmug.com/2009%20Ashland%20Variety%20Show

You are wonderful.

[denisegoldberg]

If you get a chance, can you tell me what I need to do to get my galleries on this page (link below) to be bigger (exactly like yours)? They thumbs are small and the bold text doesn't seem to fit:
You can change your site so that the category and subcategory pages stretch to the edges of the screen by adding the code in this thread - http://www.dgrin.com/showthread.php?t=93221.

If you want the text under the thumbs to not be bold, you can give this CSS a try. Personally I think the bold looks better.
#category a.nav,
#categoriesBox a.nav {
font-weight: normal;
}

Thumbs are 150x150 if there are 5 or fewer galleries and 100x100 if there are more than 5 galleries. The reason my thumbs are larger is that I have replaced smugmug's category and subcategory pages with html-only galleries, and since I built the html-only pages I can specify the size of the thumbs. I'm happy to share the code - or you can see it by looking at my page with Firefox Web Developer - but you should realize that every time I add a gallery I also need to update an html-only category or subcategory page. And in many cases I need to create a new html-only page to support my new galleries. It is worth it to me - but it's not a matter of simply changing something in your CSS. I'd love to see smugmug change the thumb sizes on the category and subcategory pages, and I've requested that in the features request thread (the sticky at the head of the smugmug support forum), but I'm not holding my breath waiting for this as a new feature. You might want to add your own request there too.

--- Denise

[402photography.com]

Thanks Denise

[402photography.com]

How about this? Can I push the galleries a little farther apart from each other so I can write a longer description on each?

[denisegoldberg]

How about this? Can I push the galleries a little farther apart from each other so I can write a longer description on each?
If you want to stretch your galleries across the screen, remove this CSS:
#galleriesBox .boxBottom {width:535px; margin-left: auto; margin-right: auto;}
And add this:
.galleries #homepage,
#content.userKeywords,
#header_wrapper, #footer_wrapper,
#cobrand_footer,
#category, #subcategory,
#header,
#smugmug, .smugmug #header, .smugmug #footer {
margin-left: 15px;
margin-right: 15px;
min-width: 755px;
width: auto;
}
As I mentioned in my previous post, to make the space for the gallery thumbs wider, experiment with the width in this CSS below until you get the look you are after. Here's what your code looks like right now:

.miniBox {width:122px; text-align:center; height:250px; margin:0 28px;}
.miniBox .photo {float:none; width:122px; height:auto; _height:1px;}
.miniBox .albumTitle {width:122px;}
.miniBox .description {width:122px;}
.miniBox .updated {width:122px;}
.loggedIn .miniBox {height:auto; min-height:300px;}
.loggedIn .miniBox .smbuttons {margin:0 auto; width:122px;}
.loggedIn .miniBox input {width:122px;}
.loggedIn .miniBox textarea {width:112px;}
.boxBottom .albumLarge {width:192px; height:350px; text-align:center; margin:0 24px;}
.albumLarge .photoLarge {float:none; width:192px; height:auto; _height:1px;}
.albumLarge .albumTitle {width:192px;}
.albumLarge .description {width:192px;}
.albumLarge .updated {width:192px;}
.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
.loggedIn .albumLarge .smbuttons {margin:0 auto; width:192px;}
.loggedIn .albumLarge input {width:192px;}
.loggedIn .albumLarge textarea {width:182px;}


Try this change and see if you like it better than the default sizes:

.miniBox {width:165px; text-align:center; height:250px; margin:0 28px;}
.miniBox .photo {float:none; width:165px; height:auto; _height:1px;}
.miniBox .albumTitle {width:165px;}
.miniBox .description {width:165px;}
.miniBox .updated {width:165px;}
.loggedIn .miniBox {height:auto; min-height:300px;}
.loggedIn .miniBox .smbuttons {margin:0 auto; width:165px;}
.loggedIn .miniBox input {width:165px;}
.loggedIn .miniBox textarea {width:165px;}
.boxBottom .albumLarge {width:215px; height:350px; text-align:center; margin:0 24px;}
.albumLarge .photoLarge {float:none; width:215px; height:auto; _height:1px;}
.albumLarge .albumTitle {width:215px;}
.albumLarge .description {width:215px;}
.albumLarge .updated {width:215px;}
.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
.loggedIn .albumLarge .smbuttons {margin:0 auto; width:215px;}
.loggedIn .albumLarge input {width:215px;}
.loggedIn .albumLarge textarea {width:215px;}

With the changes that I suggested above, here's what your page will look like:
http://denise.smugmug.com/photos/498326273_DywxN-XL.jpg

--- Denise

[402photography.com]

I like the way the galleries looks, but unfortunately, it changes the categories on the previous page (color, black and white, etc) and defaults left. I think I will jut use your spacing code below.

[402photography.com]

I like the way the galleries looks, but unfortunately, it changes the categories on the previous page (color, black and white, etc) and defaults left. I think I will jut use your spacing code below.


Thanks again Denise

[denisegoldberg]

I like the way the galleries looks, but unfortunately, it changes the categories on the previous page (color, black and white, etc) and defaults left. I think I will jut use your spacing code below.
You can select which pages you want to apply the changes to.

Frankly, I would recommend rethinking your decision to stay with 3-across galleries. You are forcing your users to scroll when in most cases that shouldn't be necessary. Yes, the width matches your banner. But as a viewer, I find the unnecessary scrolling quite annoying.

Also - are you aware that your banner does not show on IE7?

--- Denise

[402photography.com]

I will go with your recommendation Denise. Thanks you. I was not aware of the missing banner on IE...is there a fix for that?