Social Web Directory :: Social Network Directory :: Ning Tips and Ning Support
When a new member joins your Ning Network, they will see the new Ning Welcome Box. Note: Once your new member closes this box by clicking on the "X", it is no longer displayed.
You can customize the Welcome Box text, from your Language Editor.


Let's get started. Please be careful when changing code in the Language Editor. Fortunately, Ning has a "Reset Text to Original Version" button.
TIPS:
Plus, you can use our built-in HTML WYSIWYG Editor for this purpose.

The Ning platform automatically chooses the color, based on your theme. If you want to change the background color, add this code to Manage/Appearance/Advanced CSS. Change the hex color code, to the color you choose.
// The following line changes the background to deep red, and the text color to white.
#welcome.welcome-nc { background-color:#CC0000 !important; color:#FFFFFF !important; }
Be sure to click on SAVE.
/* Change background and font colors for Welcome Box */
#welcome.welcome-nc { background-color:#CC0000 !important; color:#FFFFFF !important; }
/* If you add links - - change color and underline links */
#welcome-text a {color:#ffffff!important; text-decoration:underline;}
/* Remove some margin space below the Ning Logo in non-premium */
#welcome h2 { margin:0 0 .50em; }
If you don't want the new Welcome Message Box/Banner to be displayed, go to Manage/Appearance/Advanced and add this code:
#welcome { display:none !important; } Be sure to click on SAVE.
/* Change link color below icons on right */
#welcome-icons a {color:#FFFFFF!important;}
Tags: change welcome box background, customize welcome box, remove welcome box, welcome box, welcome box colors, welcome text
Permalink Reply by JenSocial on March 30, 2012 at 1:02am Hi Safire,
I've never tried this one. I checked the CSS and this is what is there now:
#welcome-icons span, .welcome-close a.close-nc {
background: url("http://static.ning.com/socialnetworkmain/widgets/index/gfx/welcomebox-png8.png") no-repeat scroll 0 0 transparent;
display: block;
height: 260px;
position: absolute;
width: 724px;
}
You could try replacing the png with another png of the same size, changing that image URL and adding this to your Advanced CSS. You would also need to add !important, like this:
background: url("yournewimage.png") no-repeat scroll 0 0 transparent!important;
Hope that helps,
Jen

Permalink Reply by Javier Cambon Sanjurjo on July 12, 2012 at 10:19pm Hi Jen!
Do you know how I can edit the pop-up window that comes out when I click on "Add Content" in the Welcome Box?
I need to delete the "Invite Friends" option and add a new one.
And do you know how to change the distribution of the text / icons? I mean, I would love to be able to eliminate the icons, so I can write my own text in the full width of the box.
Thanks!
Permalink Reply by JenSocial on July 12, 2012 at 10:51pm Javier,
I just happened to have a test site with new membership, where the welcome box was open. I used this CSS to remove icons and make the text area wider:
#welcome-icons {display:none!important;}
#welcome-text { width:700px!important;}
Then, you have to add your text via the Language Editor like this tip instructs.
On the popup, never looked at that, and not getting the same pop-up you are getting. If you're removing the icons, guess you won't need that anyway.
Hope that helps,
Jen

Permalink Reply by Javier Cambon Sanjurjo on July 13, 2012 at 2:11am Thanks!



Started by JenSocial. Last reply by English WorldWide Apr 18. 35 Replies 0 Favorites
Started by JenSocial. Last reply by Mandy P. Mar 6. 13 Replies 0 Favorites
Started by Fire-Tech. Last reply by Fire-Tech Feb 18. 14 Replies 3 Favorites
© 2013 Created by JenSocial.
Powered by
© Copyright JenSocial.
