Hiding Galleries

[Galagirl]

Good PM everyone:

I would like to hide galleries on my home page, but still leave the slideshow. I found Earle's Thread and copied the codes:

.loggedIn #homepage {display: block;}
.homepage #homepage { display: none;}

However, since my slideshow is attached to a gallery, it removed everything. Do I need to chage {display: block;} (to something)?}

I would also like to find out how to enlarge my slideshow on the home page. I attempted to do this in the javascript section, but failed. My slideshow is in a biobox. How?

I have not been successful in linking my navagation bar to the galleries and categories. How do I accomplish this?

Thank you, galagirl
galaeventsphotography.smugmug.com

[ivar]

Well, getting close to AM here :D

try the following:.homepage #categoriesBox {
display: none;
}

.loggedIn .homepage #categoriesBox {
display: block;
}
for the links in your navbar, change the # sign to your link:
<div id="navcontainer">
<ul>
<li><a href="http://galaeventsphotography/gallery/XXXXXX">Home</a></li>
<li><a href="#">Shannon</a></li>
<li><a href="#">Jessica</a></li>
<li><a href="#">Our Work</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Order Prints</a></li>
</ul>
</div> change the XXXXXXXX to the appropriate gallery.

For the slideshow, have a look in the information it comes with here (http://www.dgrin.com/showthread.php?t=28348), if that doesn't solve it, ask your questions in that thread please :D

[Andy]

I have not been successful in linking my navagation bar to the galleries and categories. How do I accomplish this?

Thank you, galagirl
galaeventsphotography.smugmug.com
Please keep an eye on this thread, too - Joe has the very same question and I just answered it for him :D

http://www.dgrin.com/showthread.php?p=322872#post322872

[Galagirl]

That code did not work. It erased the slideshow and not the galleries? Any other thoughts?



Well, getting close to AM here :D

try the following:.homepage #categoriesBox {
display: none;
}

.loggedIn .homepage #categoriesBox {
display: block;
}
for the links in your navbar, change the # sign to your link:
<div id="navcontainer">
<ul>
<li><a href="http://galaeventsphotography/gallery/XXXXXX">Home</a></li>
<li><a href="#">Shannon</a></li>
<li><a href="#">Jessica</a></li>
<li><a href="#">Our Work</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Order Prints</a></li>
</ul>
</div> change the XXXXXXXX to the appropriate gallery.

For the slideshow, have a look in the information it comes with here (http://www.dgrin.com/showthread.php?t=28348), if that doesn't solve it, ask your questions in that thread please :D

[ivar]

That code did not work. It erased the slideshow and not the galleries? Any other thoughts?First of all..... I don't see a slideshow in IE or FF.... do you see a slideshow when you are logged out?

second.... You have a lot of stuff in your CSS that should not be there.

/* copyright notice - footer */
#GalaHeader {text-align:center; font-weight:bold; font-style:italic; color: #5C3317; font-size:45px; margin-top:50px;}
/* hides your name (including any 's) */
#userName {
display: none;
}
/* hides the word home */
#userHome {
display: none;
}
/* removed the 's */
.possess {
display: none;
}


.play_slideshow { display: none; }
#categoriesBox .boxTop { display: none; }
#feeds { display:none}
#ssControl { padding: 5px; text-align: center; } .ssBtn { outline: none; } .ssBtn img { height: 20px; width: 25px; } #ssPlay { display: none; } #ssPrev img { background-image: url(http://galaeventsphotography.com/photos/prevButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/prevButton.png'); } #ssNext img { background-image: url(http://galaeventsphotography.smugmug.com/photos/nextButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/nextButton.png'); } #ssPlay img { background-image: url(http://galaeventsphotography.smugmug.com/photos/playButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/playButton.png'); } #ssPause img { background-image: url(http://galaeventsphotography.smugmug.com/photos/pauseButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/pauseButton.png'); }
#bioBox {text-align: center;}
slideHeight = "480"; slideWidth = "640";
photoHeight = "500"; photoWidth = "700";
<img src="/img/spacer.gif" alt="" id="ssSlide" /> 1<div id=”ssCaption”></div> 2<div id="ssControl"> <a title="Previous Slide" id="ssPrev" class="ssBtn" href="javascript: void(0);" onclick="prevSlide();"><img src="/img/spacer.gif" border="0" /></a> <a title="Next Slide" id="ssNext" class="ssBtn" href="javascript: void(0);" onclick="nextSlide();"><img src="/img/spacer.gif" border="0" /></a> <a title="Pause Slideshow" id="ssPause" class="ssBtn" href="javascript: void(0);" onclick="pauseSlideshow();"><img src="/img/spacer.gif" border="0" /></a> <a title="Resume Slideshow" id="ssPlay" class="ssBtn" href="javascript: void(0);" onclick="resumeSlideshow();"><img src="/img/spacer.gif" border="0" /></a> </div>

#photoKeywords { display: none; }
.top_border, .bottom_border { border: 10px; }
.left_border, .right_border { border: 10px; }
.box { background-color: black; }
.categoriesBox .boxTop { display: none; }
.play_slideshow { display: none; }
.title { color: 5C3317; }
a.title, .title, .imgBorderOn {
color: 5C3317;
}
.box { background-color: 5C3317; }






/* navbar stuff */


#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: black;
}
#navcontainer {
margin-top: 10px;
margin-bottom: 10px;}

HTML CODE
<div id="navcontainer">
<ul>
<li><a href="http://galaeventsphotography.smugmug.com">Home</a></li>
<li><a href="http://galaeventsphotography.smugmug.com/gallery/195561">Shannon</a></li>
<li><a href="http://galaeventsphotography.smugmug.com/gallery/1533597">Jessica</a></li>
<li><a href="#">Our Work</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Order Prints</a></li>
</ul>
</div>.title { color: 5C3317; }
Body { background-color: black }
Remove all the red, and then try again with the code i gave you.

Also, like i said, make sure you see a slideshow logged out. Is your bioBox showing on your homepage?

[Galagirl]

WORKED like a dream (I bet you knew it would!!). Thank you mucho mucho mucho.

Can you please tell me what a IE and an FF is?
DUMB....I KNOW...but trying to learn. Thanks for the patience and wonderful help you and all have given me!!



First of all..... I don't see a slideshow in IE or FF.... do you see a slideshow when you are logged out?

second.... You have a lot of stuff in your CSS that should not be there.

/* copyright notice - footer */
#GalaHeader {text-align:center; font-weight:bold; font-style:italic; color: #5C3317; font-size:45px; margin-top:50px;}
/* hides your name (including any 's) */
#userName {
display: none;
}
/* hides the word home */
#userHome {
display: none;
}
/* removed the 's */
.possess {
display: none;
}


.play_slideshow { display: none; }
#categoriesBox .boxTop { display: none; }
#feeds { display:none}
#ssControl { padding: 5px; text-align: center; } .ssBtn { outline: none; } .ssBtn img { height: 20px; width: 25px; } #ssPlay { display: none; } #ssPrev img { background-image: url(http://galaeventsphotography.com/photos/prevButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/prevButton.png'); } #ssNext img { background-image: url(http://galaeventsphotography.smugmug.com/photos/nextButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/nextButton.png'); } #ssPlay img { background-image: url(http://galaeventsphotography.smugmug.com/photos/playButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/photos/playButton.png'); } #ssPause img { background-image: url(http://galaeventsphotography.smugmug.com/photos/pauseButton.png); _background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='http://galaeventsphotography.smugmug.com/pauseButton.png'); }
#bioBox {text-align: center;}
slideHeight = "480"; slideWidth = "640";
photoHeight = "500"; photoWidth = "700";
<img src="/img/spacer.gif" alt="" id="ssSlide" /> 1<div id=”ssCaption”></div> 2<div id="ssControl"> <a title="Previous Slide" id="ssPrev" class="ssBtn" href="javascript: void(0);" onclick="prevSlide();"><img src="/img/spacer.gif" border="0" /></a> <a title="Next Slide" id="ssNext" class="ssBtn" href="javascript: void(0);" onclick="nextSlide();"><img src="/img/spacer.gif" border="0" /></a> <a title="Pause Slideshow" id="ssPause" class="ssBtn" href="javascript: void(0);" onclick="pauseSlideshow();"><img src="/img/spacer.gif" border="0" /></a> <a title="Resume Slideshow" id="ssPlay" class="ssBtn" href="javascript: void(0);" onclick="resumeSlideshow();"><img src="/img/spacer.gif" border="0" /></a> </div>

#photoKeywords { display: none; }
.top_border, .bottom_border { border: 10px; }
.left_border, .right_border { border: 10px; }
.box { background-color: black; }
.categoriesBox .boxTop { display: none; }
.play_slideshow { display: none; }
.title { color: 5C3317; }
a.title, .title, .imgBorderOn {
color: 5C3317;
}
.box { background-color: 5C3317; }






/* navbar stuff */


#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: black;
}
#navcontainer {
margin-top: 10px;
margin-bottom: 10px;}

HTML CODE
<div id="navcontainer">
<ul>
<li><a href="http://galaeventsphotography.smugmug.com">Home</a></li>
<li><a href="http://galaeventsphotography.smugmug.com/gallery/195561">Shannon</a></li>
<li><a href="http://galaeventsphotography.smugmug.com/gallery/1533597">Jessica</a></li>
<li><a href="#">Our Work</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Order Prints</a></li>
</ul>
</div>.title { color: 5C3317; }
Body { background-color: black }
Remove all the red, and then try again with the code i gave you.

Also, like i said, make sure you see a slideshow logged out. Is your bioBox showing on your homepage?

[ivar]

Can you please tell me what a IE and an FF is? But of course, IE is short for Internet Explorer (aka the crappy browser :D) FF is short for FireFox (aka a good browser)

FF is much nicer, and has a cool extension for web-developing (see my signature, and a tutorial in this forum as a sticky near the top)

In neither one i saw a slideshow, but i do now, must have been the same red code messing it up, anyway, seems like you are all sorted :thumb