Current status of the Ning Platform is always available on the Ning Status Blog.

Forum

NC for Hire

Preview of Final Results. Checkout Live demo here!
Last updated 4/22/12 to fix issues address herehere and here! :p

Step 1

Setup center column of feature layout. Follow setting below and save your changes.

Step 2

The HTML: Copy and paste the html code below to the 1st textbox that we add on the
center column (see screenshot above). Important:make sure that you are in html mode when
pasting the code and save your changes.

 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="http://api.ning.com:80/files/DqaYw0w2aP8cGpmnJaUeANBZEljATNhsP2-p20hs*owSe1zEW9DArfoXTfCWDlSMLy2jhBFT*QlsMHGDrN4rVjYIlt*X3VzQ/1059729990.bin" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('.xj_leaderboard_module').addClass('indented_content');
$("ul.tabs").tabs(".indented_content");
});
</script>
<ul class="tabs">
<li><a class="current" href="#">Monthly Top 10</a></li>
<li><a href="#">Latest Activity</a></li>
<li><a href="#">Discussions</a></li>
<li><a href="#">Blogs</a></li>
</ul>

Step 3 (Final)

The Custom CSS: Copy and paste the css code below to the Advance section of your design
Studio or advance appearance if you are using the old editor. Important: there may be a need to
change some of the values on each properties below since we have different settings of our network themes. Please do so when needed.

 

ul.tabs {
height: 42px;
}
ul.tabs li {
background: none repeat scroll 0 0 #054C83;
border-right: 1px solid #FFFFFF;
float: left;
list-style: none outside none !important;
margin: 0 !important;
text-align: center;
width: 122px;
}
ul.tabs a, ul.tabs li a:hover {
background: none repeat scroll 0 0 transparent;
color: #FFFFFF;
display: block;
padding: 5px 0;
}
ul.tabs a.current {
width: 122px;
}
ul.tabs li:hover, ul.tabs a.current {
background: none repeat scroll 0 0 #0088C3;
color: #FFFFFF;
}
ul.tabs a.current:after {
border-color: #0088C3 transparent;
border-style: solid;
border-width: 10px 10px 0;
content: "";
display: block;
margin-left: 10%;
margin-top: 5px;
position: absolute;
width: 0;
}

 

save now your changes and your good to go. If you still in trouble following my steps please drop your questions down below and I will get back to you as fast as I can.

You need to be a member of Ning Creators Network to add comments!

Join Ning Creators Network

Email me when people reply –

Replies

  • AWESOME donating to you today thanks

  • awsome. i used it for diffrent gadgets..

    Code is simple and clear.. previous discussiona nd previous attempts of NC,s was so complex

  • i want to add videos and Text boxex and groups. what will be the additional code. i tryed by increasing  li tags in HTML but its not working

  • Woot Woot!! You just save me some $$$ Thanks!! +1

  • how cn i change the tab position..i want latest activity tab first,then discussions,then blogs and topten?

    • Solo for now

      <a class="current" href="#">Latest Activity</a>

      • thanks Ismail

      • Hi,
        I did that and it doesn't work... Still goes to leaders board by default... Maybe it's necessary to change some more code...

  • love you lol

  • when I tried the code one of my tabs ended up on the bottom left. I am using the 3 column layout but the tabs do not seem to fit. Would I just change the width 122px to something smaler?

This reply was deleted.

Search the Creators Network

Latest Activity

steve replied to Jeffrey Haskins's discussion Interesting post on Ning Facebook.....
"i agree Gary, if SP assumptions are right, a forced mass migration of Ning 2 owners to N3  which mo…"
1 minute ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"i gotta call em about the discussions archive failing too in 1/21 hiour whenthey open soill mention…"
16 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"OK - thanks..."
18 minutes ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"it seems to help to paste it in and post before the tinymce text editor loads yesa thats exactky it…"
19 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"Excellent suggestion, that could be the issue."
20 minutes ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"i also keep getting errors like muy comments are empty even thoughive typed i have to copy repload…"
21 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"I'm trying to clear off my emails and move my pages so I can open the doors on the new site.You can…"
22 minutes ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"is he on a mobile or pcit might be a glitch in compatability with his phonei know on 2.0 some membe…"
24 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"Thanks - he did become a creator with a Ning 3 site, so that he can interface here. Plus he holds f…"
27 minutes ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"can you let paul know for me that my ning archive files are going up now but
i had issues archiving…"
29 minutes ago
soaringeagle replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"creatoraccounts have to be appreoved and  have to be creatiors although when tapatalk was making a…"
35 minutes ago
Ken Rich replied to Ken Rich's discussion Ning Lied To Us - Your Content is Not Safe
"Ning is still not letting Paul post for some reason... At any rate he asked me to post this... ===…"
41 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"Ning is still not letting Paul post for some reason... At any rate he asked me to post this... ====…"
43 minutes ago
Ken Rich replied to Tim Atkinson's discussion My letter to Bernard Desarnauts, SVP & GM, Ning
"Hi Donna,How does that set-up work? I'm not familiar with them at all. I've heard the name a couple…"
47 minutes ago
Strumelia replied to Jeffrey Haskins's discussion Interesting post on Ning Facebook.....
"Well if Ning were to force migration to 3.0 before 3.0 even had Search, Videos, Events, Moderator r…"
1 hour ago
Kos replied to Vipster's discussion How to change the text color of one navigation tab with CSS in Ning 2.0?
"So yours should be
#xg_tab_xn76 a {color: #800000!important;}
or whatever color # you choose.  Than…"
1 hour ago
Kos replied to Vipster's discussion How to change the text color of one navigation tab with CSS in Ning 2.0?
"Ahhh the damn 'a'.  I never understood the 'a' represented the href.  Thanks SP!"
1 hour ago
SweetPotato replied to Vipster's discussion How to change the text color of one navigation tab with CSS in Ning 2.0?
"in the example you've given you would need to drill down to the a href, so it would be:
#xg_tab_for…"
2 hours ago
Kos replied to Vipster's discussion How to change the text color of one navigation tab with CSS in Ning 2.0?
"SP I've never been able to get an 'identifier' to change; just a 'class'.  What am I doing wrong? …"
2 hours ago
Gary Cobb replied to Jeffrey Haskins's discussion Interesting post on Ning Facebook.....
"Why do you see this as a positive when as you say, "it's a sign that large scale, automated migrati…"
3 hours ago
More…