Customization Questions

shniks · October 5, 2015

Hi all,

Thanks to Allen and Richard I think I am getting to where my website should be. I had a few questions on galleries - website is at http://www.nikhilshahi.com

1) On the galleries page there is a light grey border around the different gallery pics. How do I change the color of those to match the background so that the only grey color on the page is the background color?

2) If you click on individual galleries, I can't see a Gallery title. How do I put a title on the top left corner of the gallery and how do I control the font size, font color, spacing from left margin etc?

3) How do I center captions below each photo?

Thanks,

denisegoldberg · October 5, 2015

shniks wrote: »

2) If you click on individual galleries, I can't see a Gallery title. How do I put a title on the top left corner of the gallery and how do I control the font size, font color, spacing from left margin etc?

I think the easiest way to add the title to your galleries is to add the breadcrumb to Folders and/or Galleries. You can see what this looks like on my site, at a gallery level - http://www.denisegoldberg.com/Wandering-near-home/Autumn-2015/, or at a folder level - http://www.denisegoldberg.com/Wandering-near-home.

--- Denise

shniks · October 5, 2015

denisegoldberg wrote: »

I think the easiest way to add the title to your galleries is to add the breadcrumb to Folders and/or Galleries. You can see what this looks like on my site, at a gallery level - http://www.denisegoldberg.com/Wandering-near-home/Autumn-2015/, or at a folder level - http://www.denisegoldberg.com/Wandering-near-home.

--- Denise

Hi Denise - thanks for the info. However, I don't want to add a breadcrumb (yeah I know, not adding one is frowned upon) as I don't have sub-galleries and my guest normally just click on the Galleries link in the Navbar if they want to go back. I thought that there might be a way to do it in Description of the gallery using HTML.

Cheers,

denisegoldberg · October 5, 2015

shniks wrote: »

Hi Denise - thanks for the info. However, I don't want to add a breadcrumb (yeah I know, not adding one is frowned upon) as I don't have sub-galleries and my guest normally just click on the Galleries link in the Navbar if they want to go back. I thought that there might be a way to do it in Description of the gallery using HTML.

How about dragging a title content block in to All Galleries, placing it above the gallery? You can find it in the Text section of content blocks?

From the help page at http://help.smugmug.com/customer/en/portal/articles/1210628-what-are-content-blocks-and-how-are-they-used-:

Text
Add text, including titles and descriptions, to your page—WYSIWYG (What You See Is What You Get) text.

Title: If you add a Title content block to the All Folders or All Galleries section and leave the title blank, the Title block will display Folder/Gallery titles automatically.

Use the Dimensions and Options entries to adjust size and spacing.

--- Denise

shniks · October 5, 2015

denisegoldberg wrote: »

How about dragging a title content block in to All Galleries, placing it above the gallery? You can find it in the Text section of content blocks?

From the help page at http://help.smugmug.com/customer/en/portal/articles/1210628-what-are-content-blocks-and-how-are-they-used-:

Use the Dimensions and Options entries to adjust size and spacing.

--- Denise

THANKS Denise - that worked just fine. I aligned the text with the left column of photos and it looks good (I wanna play with the text size and spacing to see what is aesthetically pleasing).

Any ideas about the light grey border around the gallery photos (when you click on the Galleries in the Navbar)?

Cheers,

Lille Ulven · October 5, 2015

Even though I am not Denise ;-)

You could try this:

.sm-user-ui .sm-tiles .sm-tile-content, .sm-user-ui .sm-tiles-column-organic .sm-tile-content.sm-tile-content-empty, .sm-user-ui .sm-tiles-column-organic.sm-tiles-info-over .sm-tile-content, .sm-user-ui .sm-tiles-column-organic.sm-tiles-info-cover .sm-tile-content {
background-color: #6b6b6b !important;  /* is now: #737373; */
}

Add it in a CSS box to your gallery page.

Good luck.

Lille Ulven

shniks · October 5, 2015

Lille Ulven wrote: »

Even though I am not Denise ;-)

Add it in a CSS box to your gallery page.

Good luck.

Lille Ulven

I love you - it worked. Yay!

Now to just figure out the last bit, i.e. centering the captions below the photos and I think I am done for now. So excited - the site is looking so clean and amazing. Woohoo!

Cheers,

Allen · October 5, 2015

shniks wrote: »

I love you - it worked. Yay!

Now to just figure out the last bit, i.e. centering the captions below the photos and I think I am done for now. So excited - the site is looking so clean and amazing. Woohoo!

Cheers,

This almost does it.

.sm-gallery-image-container .sm-tile-info {text-align:center}

shniks · October 5, 2015

Allen wrote: »

This almost does it.

.sm-gallery-image-container .sm-tile-info {text-align:center}

Thanks for that Allen - it did move it, but is no centering it. No worries as the site is pretty close to completion (other than this little thing). Thanks so much for all your help as always.

Cheers,

Allen · October 5, 2015

shniks wrote: »

Thanks for that Allen - it did move it, but is no centering it. No worries as the site is pretty close to completion (other than this little thing). Thanks so much for all your help as always.

Cheers,

.sm-gallery-image-container .sm-tile-info {
text-align:center;
max-width: none;
}

shniks · October 5, 2015

Allen wrote: »

.sm-gallery-image-container .sm-tile-info {
text-align:center;
max-width: none;
}

Thanks Allen - I put that in, but no go unfortunately.

Cheers,

Allen · October 5, 2015

Did you try the !important. This worked with WebDev tool for me without it though.

.sm-gallery-image-container .sm-tile-info {
text-align:center;
max-width: none !important;
}

shniks · October 5, 2015

Allen wrote: »

Did you try the !important. This worked with WebDev tool for me without it though.

.sm-gallery-image-container .sm-tile-info {
text-align:center;
max-width: none !important;
}

Allen you ROCK! That worked. It's all good now. THANKS so much.

clap

clap

Cheers,

Customization Questions

Comments