Customize Breadcrumb

[Allen]

I've added the following to depress the breadcrumb nav while still
showing "map this" buttons etc.

/* remove navigation */
#breadcrumb a.nav {display: none;}
/* display buttons to right*/
#altViews {display: block;}
/* display larger title and push it to right some */
#breadcrumb.nav .title {font-size: 25px;font-weight: normal; position: relative; left: 80px;}

How do I get rid of the >'s from showing in the breadcrumb nav.
example: > > Butterflies
http://atsmith.smugmug.com/gallery/50044
Edit: Fixed - Link no longer applicable.
New link: http://atsmith.smugmug.com/gallery/1894747

This is in conjunction with the adding a dropdown nav at top
referenced here. Still waiting for a response.
http://www.dgrin.com/showthread.php?t=42077

Any help would be appreciated.
Thanks,
Al

FYI - I noticed if I copy the nav ( > > Butterflies) and paste here
the sub-gallery link shows. Interesting!
> Creatures (http://atsmith.smugmug.com/Creatures) > Butterflies

[Mike Lane]

I've added the following to depress the breadcrumb nav while still
showing "map this" buttons etc.

/* remove navigation */
#breadcrumb a.nav {display: none;}
/* display buttons to right*/
#altViews {display: block;}
/* display larger title and push it to right some */
#breadcrumb.nav .title {font-size: 25px;font-weight: normal; position: relative; left: 80px;}

How do I get rid of the >'s from showing in the breadcrumb nav.
example: > > Butterflies
http://atsmith.smugmug.com/gallery/50044

This is in conjunction with the adding a dropdown nav at top
referenced here. Still waiting for a response.
http://www.dgrin.com/showthread.php?t=42077

Any help would be appreciated.
Thanks,
Al

FYI - I noticed if I copy the nav ( > > Butterflies) and paste here
the sub-gallery link shows. Interesting!
> Creatures (http://atsmith.smugmug.com/Creatures) > Butterflies

Use this instead of what you've got:

#breadcrumb {visibility:hidden;} /* remove navigation */
#altViews {visibility:visible;}
#breadcrumb.nav .title {font-size: 25px; font-weight: normal; position: relative; left: 80px; visibility:visible;}

[Allen]

Use this instead of what you've got:

#breadcrumb {visibility:hidden;} /* remove navigation */
#altViews {visibility:visible;}
#breadcrumb.nav .title {font-size: 25px; font-weight: normal; position: relative; left: 80px; visibility:visible;}
Thanks Mike,
Worked like a charm. Now playing with moving title right-left so it
doesn't cover buttons on the right. I have a couple of very long
gallery names.
Al

[Mike Lane]

Thanks Mike,
Worked like a charm. Now playing with moving title right-left so it
doesn't cover buttons on the right. I have a couple of very long
gallery names.
AlAdd the red:

#breadcrumb {visibility:hidden; position:relative;} /* remove navigation */
#altViews {visibility:visible;}
#breadcrumb.nav .title {position:absolute; top:0; left:0; font-size: 25px; font-weight: normal; position: relative; left: 80px; visibility:visible;}

Play around with the top and left values until you get your title where you want it.

[Allen]

Add the red:

#breadcrumb {visibility:hidden; position:relative;} /* remove navigation */
#altViews {visibility:visible;}
#breadcrumb.nav .title {position:absolute; top:0; left:0; font-size: 25px; font-weight: normal; position: relative; left: 80px; visibility:visible;}
Play around with the top and left values until you get your title where you want it.
Thanks again Mike,
I moved the altView up a little and position the title just below. Looks
good now.
Thanks,
Al

[Mike Lane]

your homepage breadcrumb is screwy now. Add the red:

#breadcrumb {visibility:hidden; position:relative;} /* remove navigation */
.homepage #breadcrumb {visibility:visible;}
#altViews {visibility:visible; top:-12px;}
.homepage #altViews {top:0;}
#breadcrumb.nav .title {position:absolute; top:4px; left:200px; font-size: 25px; font-weight: normal; visibility:visible;}
.homepage #breadcrumb .title {position:relative; top:0; left:0; font-size:14px;}


oh and remove the green .nav part.

[Allen]

your homepage breadcrumb is screwy now. Add the red:

#breadcrumb {visibility:hidden; position:relative;} /* remove navigation */
.homepage #breadcrumb {visibility:visible;}
#altViews {visibility:visible; top:-12px;}
.homepage #altViews {top:0;}
#breadcrumb.nav .title {position:absolute; top:4px; left:200px; font-size: 25px; font-weight: normal; visibility:visible;}
.homepage #breadcrumb .title {position:relative; top:0; left:0; font-size:14px;}

oh and remove the green .nav part.
Ok did that. Only thing I see changing is the "map this" button
move a little down.
Thanks
Al

[Mike Lane]

Ok did that. Only thing I see changing is the "map this" button
move a little down.
Thanks
AlIf you were logged in as a different smugmug user you'd see a big change :thumb

[Allen]

If you were logged in as a different smugmug user you'd see a big change :thumb
Wierd, I looked at it with IE, never login there, and didn't see much change?
Thanks
Al

[Mike Lane]

Wierd, I looked at it with IE, never login there, and didn't see much change?
Thanks
AlNo no no, you've got to be logged into smugmug as some other user than yourself. Make sure you're logged in and visit mikelane2.smugmug.com and you'll see Mike Lane 2's home|this is my: friend • family and maybe |invite to join: your community name if that applies. That is what was getting messed up with the other code.

[Allen]

No no no, you've got to be logged into smugmug as some other user than yourself. Make sure you're logged in and visit mikelane2.smugmug.com and you'll see Mike Lane 2's home|this is my: friend • family and maybe |invite to join: your community name if that applies. That is what was getting messed up with the other code.
got cha! :wink Looking at my own page it doesn't show. I assume only
access to that info is in control panel. Makes sense.
AL

[Allen]

On all the Keyword pages there is the big word "view:" (span .title) to the
right of "most popular". Placement and font size seems to be tied in with the
generated keyword title. Both move when changing the left: value below.

#breadcrumb .title {position:absolute; top:0px; left:200px;
font-size: 25px; font-weight: normal; visibility:visible;}
(Bottom of CSS)

http://atsmith.smugmug.com/keyword/butterflies

I think a line is needed to isolate the keyword page breadcrumbs.
A little more help please?
Thanks
Al

[Mike Lane]

On all the Keyword pages there is the big word "view:" (span .title) to the
right of "most popular". Placement and font size seems to be tied in with the
generated keyword title. Both move when changing the left: value below.

#breadcrumb .title {position:absolute; top:0px; left:200px;
font-size: 25px; font-weight: normal; visibility:visible;}
(Bottom of CSS)

http://atsmith.smugmug.com/keyword/butterflies

I think a line is needed to isolate the keyword page breadcrumbs.
A little more help please?
Thanks
AlIt happened because you did as I suggested and removed the .nav that came right after #breadcrumb. Life would be so much easier if IE6 didn't suck so much. See here's the thing, IE6 sucks (sucks sucks sucks) and gets all choked up on #breadcrumb.nav. It will just plain old ignore it. Thanks IE6, thanks a lot. So what you're going to have to do is to tell the #altViews .title to behave differently than the #breadcrumb .title. So something like this:

#altViews .title {position:static; font-size:16px;}

should probably do the trick. Hopefully.

[Allen]

It happened because you did as I suggested and removed the .nav that came right after #breadcrumb. Life would be so much easier if IE6 didn't suck so much. See here's the thing, IE6 sucks (sucks sucks sucks) and gets all choked up on #breadcrumb.nav. It will just plain old ignore it. Thanks IE6, thanks a lot. So what you're going to have to do is to tell the #altViews .title to behave differently than the #breadcrumb .title. So something like this:

#altViews .title {position:static; font-size:16px;}

should probably do the trick. Hopefully.
Added it and then played with it with webDev and the VIEW still shows
same size as keyword title.

Al

[Mike Lane]

Added it and then played with it with webDev and the VIEW still shows
same size as keyword title.

AlYou've got to make sure it comes after the #breadcrumb .title :wink This is one of those cases where those two things have the same level of specificity so the #altViews .title must come later.

[Allen]

You've got to make sure it comes after the #breadcrumb .title :wink This is one of those cases where those two things have the same level of specificity so the #altViews .title must come later. Great, that works.:clap

I changed the theme on my homepage and cleaned it up for not_logged_in.
See breadcrumb area. Not sure what shows if other logged_in user views it.

Things need to address eventually
1. Need to decrease space between nav and bio box? EDIT: Forget it, Ok as is.
2. "More Photos" nav button box in IE not sizing correctly.
3. IE nav dropdowns in all color themes. See style box showing thru.
http://atsmith.smugmug.com/gallery/50044
Edit: New link: http://atsmith.smugmug.com/gallery/1894747
4. The added nav menu at the top interfers with the Carbonite theme.
Pick any nav button on bottom row and dropdowns disturb stuff below.
I tried a bunch of other themes and this is the only one I found like
this. http://atsmith.smugmug.com/Infrared

Thanks for the help,
headin' out birding so be back after noon.
Al

Edit: Had to add the following to the single image pages because the
title was deverting to two line or more lines.
#singleImage #breadcrumb .title {position:relative; top:0; left:0; font-size:25px;}
Luckly it worked in both IE & FF

[dcyphert]

Great, that works.:clap

I changed the theme on my homepage and cleaned it up for not_logged_in.
See breadcrumb area. Not sure what shows if other logged_in user views it.

Things need to address eventually
1. Need to decrease space between nav and bio box? EDIT: Forget it, Ok as is.
2. "More Photos" nav button box in IE not sizing correctly.
3. IE nav dropdowns in all color themes. See style box showing thru.
http://atsmith.smugmug.com/gallery/50044
4. The added nav menu at the top interfers with the Carbonite theme.
Pick any nav button on bottom row and dropdowns disturb stuff below.
I tried a bunch of other themes and this is the only one I found like
this. http://atsmith.smugmug.com/Infrared

Thanks for the help,
headin' out birding so be back after noon.
Al

Edit: Had to add the following to the single image pages because the
title was deverting to two line or more lines.
#singleImage #breadcrumb .title {position:relative; top:0; left:0; font-size:25px;}
Luckly it worked in both IE & FF

Hi Allen,
Could you tell me where to change this, at least I see it in IE....this ugly green text color in the breadcrumb trail, here's a link (http://propointmedia.smugmug.com/Sports) for an example. Thank you.