Journal gallery customisation

bopsbhargav

Hi,

This is a link to my website which is still under development

http://bhargavboppa.smugmug.com/Test/SriNamanaRiccardoDsilvaWedding

If anyone could please help with remove the empty space between each photo. I wanted it to be displayed in a blog style. Thanks

denisegoldberg

I'm not sure what space you want to remove.

What do you mean by blog style? There isn't a gallery style that I would consider to be a blog style.

--- Denise

bopsbhargav

Under every photo there is a white space(almost 2 lines of white space, I wanted to remove that. )

denisegoldberg wrote: »

I'm not sure what space you want to remove.

What do you mean by blog style? There isn't a gallery style that I would consider to be a blog style.

--- Denise

beardedgit

This should remove the empty Title Info areas directly under each image:

.sm-gallery-journal .sm-gallery-images .sm-tile > .sm-tile-info {
    display: none;
}

and this should remove the spaces between tiles:

.sm-gallery-journal .sm-tile-wrapper {
    margin-bottom: 0px;
}

Use one or both according to taste.

Does that help?

bopsbhargav

thank you, sorry for being dumb can you tell me where to add this CSS. I know how to add a CSS, I mean dragging it onto a page I am in that opens up a code window where I type it. But where do I copy paste this script for it to be applied on all galleries, thanks for the help

beardedgit wrote: »

This should remove the empty Title Info areas directly under each image:

.sm-gallery-journal .sm-gallery-images .sm-tile > .sm-tile-info {
    display: none;
}

and this should remove the spaces between tiles:

.sm-gallery-journal .sm-tile-wrapper {
    margin-bottom: 0px;
}

Use one or both according to taste.

Does that help?

beardedgit

bopsbhargav wrote: »

thank you, sorry for being dumb can you tell me where to add this CSS. I know how to add a CSS, I mean dragging it onto a page I am in that opens up a code window where I type it. But where do I copy paste this script for it to be applied on all galleries, thanks for the help

It should be fine in a CSS Content Block in either All Galleries or in Entire Site. If you want to apply it to selected galleries only, open each gallery and click "Make this Gallery Custom", drag in a CSS Content Block and put the code(s) in there.

Caveat: If it doesn't have the desired effect, insert the "!important" declaration as per the following:

.sm-gallery-journal .sm-gallery-images .sm-tile > .sm-tile-info {
  display: none!important;
}
.sm-gallery-journal .sm-tile-wrapper {
  margin-bottom: 0px!important;
}