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

⚡JFarrow⌁ replied to ⚡JFarrow⌁'s discussion You May Not Know This About Facebook
"great... glad you found it useful.."
2 hours ago
Brian Antezana replied to ⚡JFarrow⌁'s discussion You May Not Know This About Facebook
"Great tip!"
15 hours ago
George H. Compton IV replied to Klaus's discussion Scroll to the top
"You're welcome Christopher and Kos. :-)Christopher I'll see what I can do about the scroll down but…"
18 hours ago
J.Ayvar replied to J.Ayvar's discussion Our Ning Account has been hacked.
"Thank You! It does a matter the time It will take. We want to thanks that at least Ning Support rep…"
19 hours ago
Christopher M Florentino replied to Klaus's discussion Scroll to the top
"Awesome. It worked. You guys (girls) are good. I really appreciate your efforts and also making it…"
20 hours ago
Kos replied to Klaus's discussion Scroll to the top
"Sorry I can't help you further.  I'm a novice myself.  Good luck"
20 hours ago
Kos replied to Klaus's discussion Scroll to the top
"Where it says 'right: 75px;' just change that to
left: 50px;"
20 hours ago
Christopher M Florentino replied to Klaus's discussion Scroll to the top
"How can I change my Scroll Down to the LEFT SIDE? I am rather slow at this so please bare with me.…"
20 hours ago
Kos replied to Klaus's discussion Scroll to the top
"Beautiful.  I moved mine from 'right' to the 'left'.  Works beautifully.  Thank you for jumping in…"
21 hours ago
Christopher M Florentino replied to Klaus's discussion Scroll to the top
"Hey George, Scroll Up Button Guy here. If I am pushing my luck, please let me know. Would you happe…"
21 hours ago
mark gardner replied to mark gardner's discussion My network is in maintenance? Message error
"There is no response q my transfer request. what happen? . Support is slow."
21 hours ago
Christopher M Florentino replied to Klaus's discussion Scroll to the top
"George you nailed it! I am now the proud father of a "Scroll Up" Arrow. Thank You so very much, Sir."
21 hours ago
George H. Compton IV replied to George H. Compton IV's discussion (TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"Thank you Anam, Kos and Dave...  Merry Christmas everyone! :)"
22 hours ago
George H. Compton IV replied to Klaus's discussion Scroll to the top
"Here's something I just came up with it is working in all browsers that I tried it in. :-) Ning 3.…"
22 hours ago
The Ning Team replied to Steve C's discussion Does CometChat slow down Ning sites?
"Hey Steve, although I'm not familiar with that third-party chat provider, I checked out your networ…"
22 hours ago
The Ning Team replied to mark gardner's discussion My network is in maintenance? Message error
"Hey Mark, it looks like we've sent you a reply regarding this in your ticket that contains a reques…"
22 hours ago
Christopher M Florentino replied to Klaus's discussion Scroll to the top
"Anybody find a 'Scroll To Top' Code that works in Chrome. Is there any place I can go (On The Web)…"
yesterday
Kyryl_Ning_Support replied to Hugh's discussion No One Can Post on My Network
"Please fill up the ticket and describe the issue as detailed as you can (the date when the issue ha…"
yesterday
Kyryl_Ning_Support replied to Rob Neufeld's discussion In business for a decade, still down after 7 weeks
"Hi! I have just checked your network and it's up and running. If you are still unable to access the…"
yesterday
Kyryl_Ning_Support replied to mark gardner's discussion My network is in maintenance? Message error
"Hi! Are you still not able access your Ning network? If so please provide me in private with the na…"
yesterday
More…