Move "Friends/Fans" to bottom?

[VMac]

Just a quick question for the CSS experts. I want to keep the "Friends/Fans" listing on my front page, but I would like to move it to the bottom of the page. Is this possible with a simple CSS command?

Thanks,
Vance

[Mike Lane]

Just a quick question for the CSS experts. I want to keep the "Friends/Fans" listing on my front page, but I would like to move it to the bottom of the page. Is this possible with a simple CSS command?

Thanks,
Vance
There is currently no way to do this (well no way using only css certainly). Once the new mods to the home page are released you will probably be able to do it.

[{JT}]

There is no easy way to do this using CSS ... but you CAN do it using Javascript. Let's say that you want to swap out your galleries box with your Friends and Family box (btw, this will NOT work until the new design for the homepage is out); just put this in the javascript section:

// look to swap after the page is loaded
onload = swapFF;
// the swap function
function swapFF() {
// look at the body classes, if it is the homepage then swap
bodyClass = document.getElementsByTagName("body")[0].className;
if (bodyClass.indexOf("homepage") != -1) {
swap = document.getElementById("ffBox").innerHTML;
document.getElementById("ffBox").innerHTML = document.getElementById("galleriesBox").innerHTML;
document.getElementById("galleriesBox").innerHTML = swap;
}
}

Also any styles you have applied specifically to either of those two boxes will NOT swap with them. So if you made the friends and family box have a red background, then the galleries background would be red after the swap.

[Mike Lane]

There is no easy way to do this using CSS ... but you CAN do it using Javascript. Let's say that you want to swap out your galleries box with your Friends and Family box (btw, this will NOT work until the new design for the homepage is out); just put this in the javascript section:

// look to swap after the page is loaded
onload = swapFF;
// the swap function
function swapFF() {
// look at the body classes, if it is the homepage then swap
bodyClass = document.getElementsByTagName("body")[0].className;
if (bodyClass.indexOf("homepage") != -1) {
swap = document.getElementById("ffBox").innerHTML;
document.getElementById("ffBox").innerHTML = document.getElementById("galleriesBox").innerHTML;
document.getElementById("galleriesBox").innerHTML = swap;
}
}

Also any styles you have applied specifically to either of those two boxes will NOT swap with them. So if you made the friends and family box have a red background, then the galleries background would be red after the swap.
So uh does that mean that the home page body tag is going to have a class "homepage"???

:clap

[{JT}]

There are LOTS of neat things coming out with this release that I am proud of, just wait ...

So uh does that mean that the home page body tag is going to have a class "homepage"???

:clap

[Mike Lane]

There are LOTS of neat things coming out with this release that I am proud of, just wait ...
I'm going away tonight and most of tomorrow and I just KNOW this is going to come out when I'm gone. That's how it always happens :wxwax

:D

[VMac]

Okay, any update here? :scratch :D

[{JT}]

Have you cut and pasted my code up above? It should work. But you should also be able to move your galleries above your friends and family box using the move tools in the top right of each box.

Okay, any update here? :scratch :D

[DoctorIt]

Have you cut and pasted my code up above? It should work. But you should also be able to move your galleries above your friends and family box using the move tools in the top right of each box.Nope, the move tools will only move the galleries down... I don't have anything else down there, so it doesn't make much sense however. I can move it down, then I get a move up option, but nothing really changes.

:scratch

the family/friends and featured galleries do not have the move tool :dunno

[{JT}]

Ok, i think you are right - just use my javascript then :)

Nope, the move tools will only move the galleries down... I don't have anything else down there, so it doesn't make much sense however. I can move it down, then I get a move up option, but nothing really changes.

:scratch

the family/friends and featured galleries do not have the move tool :dunno

[DoctorIt]

Ok, i think you are right - just use my javascript then :)OK, I put it in the Javascript box... but nothing happened. :scratch

Am I pasting it in the right place?

[{JT}]

Send me a link, it works for me:

http://jt.smugmug.com/


OK, I put it in the Javascript box... but nothing happened. :scratch

Am I pasting it in the right place?

[VMac]

Send me a link, it works for me:

http://jt.smugmug.com/

Did not work for me either... I tried pasting at the top of my stylesheet and at the end. No luck.

Thanks for trying though. :):

[Mike Lane]

I'm going away tonight and most of tomorrow and I just KNOW this is going to come out when I'm gone. That's how it always happens :wxwax

:D
I just KNEW it would happen that way!

[DoctorIt]

Send me a link, it works for me:

http://jt.smugmug.com/doctorit.smugmug.com (http://doctorit.smugmug.com)

weird, I just loaded our pages up next to each other in firefox, and checked out the source code for both. They are identical, the javascript is there in the same place for both our pages, but for some reason, mine doesn't work like yours. Yours loads up, THEN the ff box moves down. Mine just sits there.

still :scratch

[{JT}]

It is not working because you don't have a galleriesBox, you have a categoriesBox. Just swap galleriesBox with categoriesBox in your JS and it will work.

doctorit.smugmug.com (http://doctorit.smugmug.com)

weird, I just loaded our pages up next to each other in firefox, and checked out the source code for both. They are identical, the javascript is there in the same place for both our pages, but for some reason, mine doesn't work like yours. Yours loads up, THEN the ff box moves down. Mine just sits there.

still :scratch

[VMac]

It is not working because you don't have a galleriesBox, you have a categoriesBox. Just swap galleriesBox with categoriesBox in your JS and it will work.

I just tried this, with still no luck. I replaced both instances of galleries with categories... nothing budged. :dunno

[{JT}]

The code needs to go in your javascript box, NOT styles. If you still have problems please provide a link to your site and I can look.

I just tried this, with still no luck. I replaced both instances of galleries with categories... nothing budged. :dunno

[VMac]

It is not working because you don't have a galleriesBox, you have a categoriesBox. Just swap galleriesBox with categoriesBox in your JS and it will work.

Details, details... Sweet success!

[Andy]

doctorit.smugmug.com (http://doctorit.smugmug.com)

weird, I just loaded our pages up next to each other in firefox, and checked out the source code for both. They are identical, the javascript is there in the same place for both our pages, but for some reason, mine doesn't work like yours. Yours loads up, THEN the ff box moves down. Mine just sits there.

still :scratch

i just looked and yours is working fine, doc :D

[DoctorIt]

I'm dredging up the past... :evil

I remember giving up on this, and just had to go through the whole process again, and found the problem. I did indeed make my FF go to the bottom, but the Featured Galleries also went to the bottom. I don't like that, I want the order to be (top to bottom): bio, featured, galleres, FF. Using this javascript, I get bio, galleries, featured, FF.

:wxwax

with all the updates, is there a more slick way to do this now, by any chance?
:ear

[Andy]

I'm dredging up the past... :evil

I remember giving up on this, and just had to go through the whole process again, and found the problem. I did indeed make my FF go to the bottom, but the Featured Galleries also went to the bottom. I don't like that, I want the order to be (top to bottom): bio, featured, galleres, FF. Using this javascript, I get bio, galleries, featured, FF.

:wxwax

with all the updates, is there a more slick way to do this now, by any chance?
:ear
Keep asking - if it's doable, the stylers or JT will let us know. Thanks :thumb

[DoctorIt]

Keep asking - if it's doable, the stylers or JT will let us know. Thanks :thumbOh great stylers, please give us the power to move the main "boxes" (for lack of a better description) as we see fit.

Pretty please,

with a cherry on top. :D

[Andy]

Oh great stylers, please give us the power to move the main "boxes" (for lack of a better description) as we see fit.

Pretty please,

with a cherry on top. :D

Does this help? (http://blogs.smugmug.com/web-tricks/2005/09/01/swapping-homepage-boxes/)

[Mike Lane]

I'm dredging up the past... :evil

I remember giving up on this, and just had to go through the whole process again, and found the problem. I did indeed make my FF go to the bottom, but the Featured Galleries also went to the bottom. I don't like that, I want the order to be (top to bottom): bio, featured, galleres, FF. Using this javascript, I get bio, galleries, featured, FF.

:wxwax

with all the updates, is there a more slick way to do this now, by any chance?
:earNo change, you'll still need to use javascript to do this.

[DoctorIt]

Duh. :rolleyes

I just figured out this morning why my order was messed up. I wasn't moving the ffBox to the bottom, I was switching it with the categoriesBox, so the featuredBox stayed right where it was supposed to, in the middle!!!
:lol3

So for reference, I know now that I can pull another switch and get the order I want, but I've decided I really don't like it. the switch happens after the page loads and looks very uncool to me.

I guess I'm just going back to removing my ffBox from the homepage.

thanks all, for the help. I'll stay tuned for new developments, now that I know what I'm looking for.
:thumb




Disregard...
I'm pasting my version of the code here, so I have the option of copying it back if I change my mind.

// look to swap after the page is loaded
onload = swapFF;
// the swap function
function swapFF() {
// look at the body classes, if it is the homepage then swap
bodyClass = document.getElementsByTagName("body")[0].className;
if (bodyClass.indexOf("homepage") != -1) {
swap = document.getElementById("ffBox").innerHTML;
document.getElementById("ffBox").innerHTML = document.getElementById("categoriesBox").innerHTML;
document.getElementById("categoriesBox").innerHTML = swap;
}
}

[dirtbikejunkie]

I've tried several times and still can't get this to work??? nothing seems to swap position?? any suggestions?

http://trav.smugmug.com

[Jill Bazeley]

I'd also like to know if there's a foolproof way to move Friends/Family to the bottom!