The Challenge

[Patrick Chappelle]

So here I am looking at a few Ning networks, and trying to come up with ideas for further removing the "Ning-ness" from my network. Just now, an idea came to me. Now I don't know if it's possible, someone with superior coding skills will have to determine that. We already know that it's possible to remove the sign-up/sign-in box, but is it possible to move it to the Ning bar? I don't mean just the default log in, I mean the alternative log-in icons as well (Google, Windows, Yahoo, etc.). Maybe even make it more noticeable, and possibly get rid of the search box in the process.

Assuming this is possible, would it conflict with the tip offered by Jen and Kris about adding our logo to the Ning bar? There's another avenue I'd like to explore (if the gentleman would be so kind as to share his wisdom) is SweetPotato's unique log-in mod. I don't mean to copy the mod verbatim, but to be able to create one similar to it, that could be customized for our individual networks.

There you have it. This is your challenge, dear coders. May The Fates be with you.

[SweetPotato]

Hey Thunder, here is my code for the sign up mod. not the tidiest or shortest way of writing the code, must of done it at midnight or something and don't have time to tidy now.

/* SIGN UP BOX */
#xg_module_account .xg_signup {
    -moz-border-radius:40px 5px 40px 5px;
-webkit-border-radius:40px 5px 40px 5px;
border-radius:40px 5px 40px 5px;
    color: #FFFFFF;
    height: 84px;
    padding-bottom: 1em;
    padding-left: 0;
    padding-right: 0;
    padding-top: 6px;
    text-align: center;
border:solid 1px #41515D;
background:#41515D;
-webkit-box-shadow: 2px 2px 2px 0px #000000;
-moz-box-shadow: 2px 2px 2px 0px #000000;
box-shadow: 2px 2px 2px 0px #000000;
text-shadow:1px 1px 1px #000000;
}

/* Custom Sign Up Button  */
div.xg_signup big strong a {
    background-color: #E00B3B;
    color: #FFFFFF;
    display: block;
    font-size: 20px;
    height: 35px;
    margin-bottom: -15px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 7px;
    width: 120px;
    -moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}

.xg_external_signup {
    display: none;
}

div#xg_module_account.xg_module div.xg_module_body p.last-child a{
color:#ffffff;
}

Enjoy

SP

[MAXX]

Thanks for sharing SP!  How do i make the box and also the button taller?  I tried changing the variable for "height" but it didnt do anything.

[Patrick Chappelle]

Sorry for responding so late, SP. Thanks!