Lynne's Site Reorg thread

[urbanaries]

Doing a bit of year end (year beginning?) clean up and i'm sure i'll have more issues but here is my first...

I have wedding galleries broken up in categories like this:

http://www.lynnehulbert.com/WeddingProofs/435524

Question 1: in FF, there seems to be a LOT of padding between the boxes vertically, any idea why?

Question 2: Why aren't my gallery names centered under the box?

I built this site about a year and a half ago, so while I do remember pasting in some CSS code for boxes to line up, I don't know where or what it is that is live. It is entirely possible I did it more than once and didn't delete old or bad code.

TIA!

[Allen]

Doing a bit of year end (year beginning?) clean up and i'm sure i'll have more issues but here is my first...

I have wedding galleries broken up in categories like this:

http://www.lynnehulbert.com/WeddingProofs/435524

Question 1: in FF, there seems to be a LOT of padding between the boxes vertically, any idea why?

Question 2: Why aren't my gallery names centered under the box?

I built this site about a year and a half ago, so while I do remember pasting in some CSS code for boxes to line up, I don't know where or what it is that is live. It is entirely possible I did it more than once and didn't delete old or bad code.

TIA!
Question 2: If you remove this the titles center and it remains 2 across for thumbs.

/* ==================================================== */
/* == FAQ #54, Line up boxes with titles underneath === */
/* ============== Current as of 6 Sep 06 ============== */
/* ==================================================== */

.miniBox {width:122px; text-align:center; height:210px; margin:0 28px;}
.miniBox .photo {float:none; width:122px; height:auto; _height:1px;}
.miniBox .albumTitle {width:122px;}
.miniBox .description {width:122px;}
.miniBox .updated {width:122px;}

.loggedIn .miniBox {height:auto; min-height:300px;}
.loggedIn .miniBox .smbuttons {margin:0 auto; width:122px;}
.loggedIn .miniBox input {width:122px;}
.loggedIn .miniBox textarea {width:112px;}

.boxBottom .albumLarge {width:192px; height:350px; text-align:center; margin:0 24px;}
.albumLarge .photoLarge {float:none; width:192px; height:auto; _height:1px;}
.albumLarge .albumTitle {width:192px;}
.albumLarge .description {width:192px;}
.albumLarge .updated {width:192px;}

.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
.loggedIn .albumLarge .smbuttons {margin:0 auto; width:192px;}
.loggedIn .albumLarge input {width:192px;}
.loggedIn .albumLarge textarea {width:182px;}

If you remove this instead the titles center and you get 3 thumbs across.

/* Line up the boxes properly */
#category #galleriesBox .albumLarge {
width: 342px;
height: 290px;
margin: 20px 11px;
padding: 0;
}

#category #galleriesBox .albumLarge .photoLarge {
width: 342px;
height: auto;
_height: 1%;
}

#category #galleriesBox .albumLarge .albumTitle {
clear: both;
text-align:center;
}

/* Align Album Titles */

.miniBox {
width:106px;
padding:0 0 5em 0;
margin:0 129px 0;
}

.miniBox .photo {
height:auto;
_height:1px;
}

.miniBox .albumTitle,
.miniBox .private {
text-align:center;
}

[urbanaries]

[/code] If you remove this instead the titles center and you get 3 thumbs across.

/* Line up the boxes properly */
#category #galleriesBox .albumLarge {
width: 342px;
height: 290px;
margin: 20px 11px;
padding: 0;
}

#category #galleriesBox .albumLarge .photoLarge {
width: 342px;
height: auto;
_height: 1%;
}

#category #galleriesBox .albumLarge .albumTitle {
clear: both;
text-align:center;
}

/* Align Album Titles */

.miniBox {
width:106px;
padding:0 0 5em 0;
margin:0 129px 0;
}

.miniBox .photo {
height:auto;
_height:1px;
}

.miniBox .albumTitle,
.miniBox .private {
text-align:center;
}

Beautiful!!!! Thanks so much Allen! :clap:clap:clap

Anyway to make them tighter vertically? It's not self evident there's more to scroll down to, depending on your screen size.

[denisegoldberg]

Anyway to make them tighter vertically? It's not self evident there's more to scroll down to, depending on your screen size.
Experiment with the height specified on the .minibox and .boxBottom .albumLarge entries - I found that changing the height in the .minibox entry to 160px tightened things up a bit.

Also - do you mean to show the subcategory "HiddenGalleries" within your Portfolio? The name kind of jumped out at me, wondered if the two galleries that are shown just aren't marked as private.

--- Denise

[urbanaries]

Experiment with the height specified on the .minibox and .boxBottom .albumLarge entries - I found that changing the height in the .minibox entry to 160px tightened things up a bit.

Thanks! I did and found a happy medium! I am a bit rusty on what is "safe" to expiriment with so I really appreciate it.

Also - do you mean to show the subcategory "HiddenGalleries" within your Portfolio? The name kind of jumped out at me, wondered if the two galleries that are shown just aren't marked as private.

--- Denise

Whoops! Been reorganizing galleries behind the scenes as you guessed! Thanks for catching that!

[urbanaries]

Ok, I've made some progress but on to the next set of issues.....if you go to my site please know I know that the links aren't "quite right" yet...working on the back end!

1. I'd like my current (new) navbar (http://www.lynnehulbert.com/) to be much shorter vertically. I know how to make the header container and image shorter, but how do I line up my navigation to the right of my header instead of under it? Is there code I need to alter or is the size of my buttons preventing this from happening? Example 1 (http://www.tippiepics.com/) Example 2 (http://www.photoscapedesign.com/) (I realize Barb isn't using images as her navigation buttons though)

2. There is a black dot in my footer (to the left of "contact Lynne" and I can't figure out for the life of me where it came from, or how to get rid of it!!! :dunno:scratch

3. I realize everyone's going to the flash slideshow, but I don't really want a slideshow at least for now. I think I can fake the slideshow out to appear to be one big fat static graphic. It's almost there now, it just flickers. Where in the slideshow code can I change the fade transitions or disable them? I am hesitant to mess with the Java esp since it isn't supported anymore :D

Gosh, I feel like I'm cleaning out a huge closet where it gets worse before it gets better! LOL

[denisegoldberg]

1. I'd like my current (new) navbar (http://www.lynnehulbert.com/) to be much shorter vertically. I know how to make the header container and image shorter, but how do I line up my navigation to the right of my header instead of under it? Is there code I need to alter or is the size of my buttons preventing this from happening? Example 1 (http://www.tippiepics.com/) Example 2 (http://www.photoscapedesign.com/) (I realize Barb isn't using images as her navigation buttons though)
Lynne -
Allen helped someone line up a header and navbar yesterday in this thread - http://www.dgrin.com/showthread.php?t=80533. I would think that some variation of that code will work for you.

I also have a header / navbar on one line, but I did it in a less approved way by embedding my entries in a table. Probably better to use Allen's method!
2. There is a black dot in my footer (to the left of "contact Lynne" and I can't figure out for the life of me where it came from, or how to get rid of it!!!
That black dot is because you have the mailto <a statement inside of a <li>...</li>. li is a line item, and it is normally used with bullets. So just remove those two elements, changing your entry to (without the *s):
<*a href="mailto: lynnehulbert@yahoo.com"><*img src="*http://www.lynnehulbert.com/photos/240177535-L.jpg" border="0" alt="Contact"><*/a>
3. I realize everyone's going to the flash slideshow, but I don't really want a slideshow at least for now. I think I can fake the slideshow out to appear to be one big fat static graphic.
Why not remove the slideshow code and just display a single image in its place?
--- Denise

[urbanaries]

Lynne -
Allen helped someone line up a header and navbar yesterday in this thread - http://www.dgrin.com/showthread.php?t=80533. I would think that some variation of that code will work for you.

Sweet! Thanks for pointing me in the right direction Denise.

That black dot is because you have the mailto <a statement inside of a <li>...</li>. li is a line item, and it is normally used with bullets. So just remove those two elements....
Awesome! I think I understand what was wrong. I am trying to reverse engineer with very rudimentary html knowledge:D. At any rate the fix worked like a charm.

Why not remove the slideshow code and just display a single image in its place?
--- Denise

Hmmm, well....I am definitely open to that, just embarrassed to say I don't know what all to delete and/or change to do that. :hide

[denisegoldberg]

Lynne -
Are you still interested in displaying a single image on your home page?

If so, this post from richW might be of interest - http://www.dgrin.com/showpost.php?p=719295&postcount=10.

--- Denise

[urbanaries]

Lynne -
Are you still interested in displaying a single image on your home page?

If so, this post from richW might be of interest - http://www.dgrin.com/showpost.php?p=719295&postcount=10.

--- Denise

Thank you Denise! I have seen that post and would still like to do that. I wonder if you could clarify something for me that is well below your capacity though. What does the Bio Box have to do with my slideshow or front/home page? I have a photo of myself in my biobox, and a description that I want the search engines to display as my "description" (and they do (http://www.google.com/search?q=lynne+hulbert&sourceid=navclient-ff&ie=UTF-8&rlz=1B3GGGL_enUS231US231)). I don't fully comprehend the connection and implications. I can cut and paste like any monkey, but without fully understanding what I'm doing I'm just going to break it and then beg you all to fix it for me! :D

[denisegoldberg]

Thank you Denise! I have seen that post and would still like to do that. I wonder if you could clarify something for me that is well below your capacity though. What does the Bio Box have to do with my slideshow or front/home page? I have a photo of myself in my biobox, and a description that I want the search engines to display as my "description" (and they do (http://www.google.com/search?q=lynne+hulbert&sourceid=navclient-ff&ie=UTF-8&rlz=1B3GGGL_enUS231US231)). I don't fully comprehend the connection and implications. I can cut and paste like any monkey, but without fully understanding what I'm doing I'm just going to break it and then beg you all to fix it for me! :D
The directions for the slideshow point folks to put the slideshow in the bio box. I think that's because it's easier for most people; there's no thinking about where it should go.

I have my slideshow in my header. I still need to switch my homepage slideshow from the old to the new Shizam show, but I am still going to put it in my header and not my bio box. I'd prefer to keep those two things as two separate entities (it just feels cleaner to me...).

But - if you have your slideshow in your biobox, you can still put info there to be picked up by the search engines. To do this, add a div in CSS like this:
#myBioText {display: none;}

Then start your bio with
<div id="myBioText>
your bio text to be picked up by search engines
</div>

and follow that with your slideshow parameters.

Hope this helps. If it's still clear as mud, let me know and I'll try again!

--- Denise

[urbanaries]

The directions for the slideshow point folks to put the slideshow in the bio box. I think that's because it's easier for most people; there's no thinking about where it should go.

I have my slideshow in my header. I still need to switch my homepage slideshow from the old to the new Shizam show, but I am still going to put it in my header and not my bio box. I'd prefer to keep those two things as two separate entities (it just feels cleaner to me...).

But - if you have your slideshow in your biobox, you can still put info there to be picked up by the search engines. To do this, add a div in CSS like this:
#myBioText {display: none;}

Then start your bio with
<div id="myBioText>
your bio text to be picked up by search engines
</div>

and follow that with your slideshow parameters.

Hope this helps. If it's still clear as mud, let me know and I'll try again!

--- Denise

Denise, you are always incredibly patient and kind. Thanks for being so helpful, I'm not sure what motivates you to do so but I appreciate it! :bow

Ok, I think I understand now, that the biobox applies to some folks but not all. I believe my slideshow is in my footer, at least, that's where this code resides:
,<div align=center>
<div id="Lynneslideshow"></div>
</div>
******** type="text/javascript">
/* required slideshow variables */
slideshowContainerId = "Lynneslideshow";
slideshowUrl = "http://www.lynnehulbertphotography.smugmug.com/gallery/1999941";
/* optional slideshow variables */

if (YD.hasClass(document.body,'homepage') && !YD.hasClass(document.body,'galleries')) {
loadSlideshow ();
}
</********

Is that right?

So, if I wanted to use the code RichW suggested, would I need to delete any and all code that references the slideshow from CSS, Java and Footer customization bays, then enter the (edited) RichW code in my biobox?

[denisegoldberg]

Ok, I think I understand now, that the biobox applies to some folks but not all. I believe my slideshow is in my footer, at least, that's where this code resides:
,<div align=center>
<div id="Lynneslideshow"></div>
</div>
******** type="text/javascript">
/* required slideshow variables */
slideshowContainerId = "Lynneslideshow";
slideshowUrl = "http://www.lynnehulbertphotography.smugmug.com/gallery/1999941";
/* optional slideshow variables */

if (YD.hasClass(document.body,'homepage') && !YD.hasClass(document.body,'galleries')) {
loadSlideshow ();
}
</********

Is that right?

So, if I wanted to use the code RichW suggested, would I need to delete any and all code that references the slideshow from CSS, Java and Footer customization bays, then enter the (edited) RichW code in my biobox?
You may not need to delete everything, although it may be cleaner if you do. Just make sure to keep a backup copy of your CSS, javascript, and footer code in case you want to go back to your current implementation.

And the post from richW describes how to put the splash photo in either your footer or your bio box. There's no reason why you can't continue to use your footer.

--- Denise

[urbanaries]

You may not need to delete everything, although it may be cleaner if you do. Just make sure to keep a backup copy of your CSS, javascript, and footer code in case you want to go back to your current implementation.

And the post from richW describes how to put the splash photo in either your footer or your bio box. There's no reason why you can't continue to use your footer.

--- Denise

Ok, the wheels are turning, it's starting to click! Thanks Denise!

ETA: And the site home is a single image now, I am so excited! Now I can work on getting the nav lined up like I want without worrying about breaking the slideshow :) THANKS!!!

[urbanaries]

I may need to start a new thread but can a "hidden" photo still serve as a feature photo?

Example:
http://lynnehulbertphotography.smugmug.com/Pricing/438301

There is one photo in there, I see it as the feature photo when I'm logged in, but not when logged out. I'd like it to show the feature photo in the parent subcategory page, but not in the html only page. Possible?

[denisegoldberg]

I may need to start a new thread but can a "hidden" photo still serve as a feature photo?

Example:
http://lynnehulbertphotography.smugmug.com/Pricing/438301

There is one photo in there, I see it as the feature photo when I'm logged in, but not when logged out. I'd like it to show the feature photo in the parent subcategory page, but not in the html only page. Possible?
I just did a little playing, and you can do what you want, just not with a hidden photo.

Put the photo you want to show on the parent category page in your (html-only) gallery, and set it as the featured photo for that gallery. Then move the photo into a different gallery - leaving your html-only gallery without any photos but with a featured photo set to display for that gallery in the category (or sub-category) page.

You can't delete the photo. So you might want to set up a private gallery that you'll use for images like this.

--- Denise

[Allen]

If you're using the gallery description for an html type gallery and it contains
photos/images I find it's best to keep them in that gallery so they are not lost.
Same with a feature photo.


Then just add some CSS to toggle off the photos from showing below.
For a journal style gallery you would add this to your CSS.

.gallery_xxxxxxxx .journal_entry {display:none;}
.loggedIn .gallery_xxxxxxxx .journal_entry {display:block;}

[denisegoldberg]

If you're using the gallery description for an html type gallery and it contains
photos/images I find it's best to keep them in that gallery so they are not lost.
Same with a feature photo.


Then just add some CSS to toggle off the photos from showing below.
For a journal style gallery you would add this to your CSS.

.gallery_xxxxxxxx .journal_entry {display:none;}
.loggedIn .gallery_xxxxxxxx .journal_entry {display:block;}
Thanks Allen - I suspected I should have left that answer for you!

--- Denise