[[Sorry, but this script is currently not working. I'm investigating whether there is a new way to do this or not.]]

Upon occasion, there is a need to use different CSS depending upon whether a gallery is unlisted or not. In particular, one site owner wants to hide the Facebook and Twitter buttons for unlisted galleries, but still leave the Easy Sharing button enabled. Unfortunately, Smugmug does not include any CSS tags to indicate whether the gallery is unlisted or not. This customization will add such a tag. To use this customization do the following two steps:

Step 1 - add javascript code

Copy this javascript to your bottom javascript:

YE.onContentReady("breadCrumbTrail", function() 
{
    var privates = Sizzle(".galleryPage #breadCrumbTrail .private");
    if (privates.length != 0)
    {
        YD.addClass(document.body, "unlistedGallery");
    }
    else if (YD.hasClass(document.body, "galleryPage"))
    {
        YD.addClass(document.body, "publicGallery");
    }
});

Step 2 - add appropriate CSS

Add whatever CSS you want to use. The script will add a class to the body tag called "unlistedGallery" if the current page is a gallery page and the gallery is unlisted. The script will add a class to the body tag called "publicGallery" if the current page is a gallery page and the gallery is not unlisted. Password protected galleries will also be labeled publicGallery.


For example, if you want to allow the Sharing button to display in an unlisted galery (so you've enabled Easy Sharing in Gallery Settings), but you want to hide the Twitter and Facebook buttons because they make it to easy to inadvertently disclose an unlisted gallery, you would follow Step 1 above and then add this CSS to your advanced customization:

#quickShare {display: none;}
.publicGallery #quickShare {display: block;}

This will hide the quickShare buttons by default, but show them if it's a public gallery.

Say I want to use your example; where do I insert the last two lines of code?

Originally Posted by mikelane84 Say I want to use your example; where do I insert the last two lines of code?

Are you referrng to this?
#quickShare {display: none;}
.publicGallery #quickShare {display: block;}

Goes in the CSS box on the customize page in your control panel.
Under customize tab.
Advanced Customizer > Site-wide.