Different banner for a gallery

qpurser · June 22, 2014

I have doing some searching but really coulcn't find an answer.

I have set a general banner for "entire site".
However for one gallery I would like to use a different one but can't figure out how to do it.

Maybe with some css but would need some input how to do it.

Thanks for any help
-Michael-

basflt · June 22, 2014

go to the gallery

customize > customize site
on the right pane you see ; +make this gallery custom

thats it

note that it wont obey general site-wide settings any more
if you want it to be the same , you copy the settings from site-wide to this gallery

Allen · June 22, 2014

I could not find a simple way to do this. I finally created two banners site wide then added site
wide CSS to hide/show on every page that I wanted a different one on.

I have many bird pages and each has a different banner so for each I hide/show the one I want.
example CSS in entire site CSS. (a total of about 2300 lines of CSS)
5027770 specific widget on every bird page
5028039 general site wide widget
fpXWN is specific page

.sm-page-widget-5027770 {visibility: hidden; height:0}

... many lines for every bird page
.sm-page-node-fpXWN .sm-page-widget-5028039
{visibility: hidden; height:0}

... many lines for every bird page
.sm-page-node-fpXWN .sm-page-widget-5027770
{visibility: visible; height:auto}

This would all be very simple if I could use a class name like category name in legacy to target every child page.
We need CSS flow down.
http://www.dgrin.com/showthread.php?t=239444

qpurser · June 22, 2014

Thanks Allen. I think I can follow you but not quite there.

I userd firebug and found for the banner container:

Allen · June 22, 2014

qpurser wrote: »

Thanks Allen. I think I can follow you but not quite there.

I userd firebug and found for the banner container:
<div id="sm-page-widget-MfWW3bP7" class="sm-page-widget sm-page-widget-image sm-page-widget-1792081" data-typeid="1792081">

Then I used in a css placeholder:
.sm-page-widget-1792081 {visibility: hidden; height:0}

This worked fine to have the banner "disappear" on only this page

What do I vae to add now there in the css to have a different banner displayed?

Thanks again and really appreciate the help
-Michael-

I added two banners in the header for the entire site so both showed on every page ABOVE the menu
which was also in the header.
Problem is getting the new banner to show above the menu on single page. I could not find a way to
do this without adding in header on entire site.

BTW, the page class name is in the <body ... class at the top in Firebug or inspect element.

qpurser · June 23, 2014

Well that is weird.
I folowed again your input.

I dragged the 2nd banner above the one I had in "entire site"

went to one particular gallery and addes the CSS:

.sm-page-node-c4HjL .sm-page-widget-6787266 {visibility: visible;height:auto}
.sm-page-node-c4HjL .sm-page-widget-1792081 {visibility: hidden; height:0}

From the moment I put in the code the 2nd banner shows up while I am still in the editor.

After I click "publish" the banner disappears and doesn't shop up anymore

Allen · June 23, 2014

qpurser wrote: »

Well that is weird.
I folowed again your input.

I dragged the 2nd banner above the one I had in "entire site"

went to one particular gallery and addes the CSS:

.sm-page-node-c4HjL .sm-page-widget-6787266 {visibility: visible;height:auto}
.sm-page-node-c4HjL .sm-page-widget-1792081 {visibility: hidden; height:0}

From the moment I put in the code the 2nd banner shows up while I am still in the editor.

After I click "publish" the banner disappears and doesn't shop up anymore

Assuming 6787266 is the one you will only show on specific pages add the CSS rule to hide it everywhere first.

.sm-page-widget-6787266 {visibility: hidden; height:0}
.sm-page-node-c4HjL .sm-page-widget-6787266 {visibility: visible;height:auto}
.sm-page-node-c4HjL .sm-page-widget-1792081 {visibility: hidden; height:0}

qpurser · June 23, 2014

Thanks again.

Added what you said in the "entire site"
Works great. The invisible one shows nowhere

But when I add the code (without the first line) to the "this gallery only" css it will show up until I save.
After "publishing" nothing shows up.
Seems it is not saving properly or could it be it is an issue as this gallery is password protected?

Allen · June 23, 2014

qpurser wrote: »

Thanks again.

Added what you said in the "entire site"
Works great. The invisible one shows nowhere

But when I add the code (without the first line) to the "this gallery only" css it will show up until I save.
After "publishing" nothing shows up.
Seems it is not saving properly or could it be it is an issue as this gallery is password protected?

I put all the CSS in the entire site. This works because it has the specific gallery class as part of the
CSS. No need to make gallery custom.

turn off site wide
.sm-page-widget-6787266 {visibility: hidden; height:0}
only for this specific gallery
.sm-page-node-c4HjL .sm-page-widget-1792081 {visibility: hidden; height:0}
.sm-page-node-c4HjL .sm-page-widget-6787266 {visibility: visible;height:auto}

Different banner for a gallery

Comments