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

Hi there :)

NING 3.0 has still any problem, however we knew NING 3.0 is totaly POWERFUL more than NING 2.0.

As you know, Individual CSS-MarkUp is gone in NING 3.0. It means, You can not add any icon on each menu-tab.

Do you know you can use "<i>"tag in Tab-title?
So, You can add the icon using <i> tag :D

See Example: http://skf-japan.ning.com*I'm sorry. This is Japanese Site.

[How to do that?]

1: Site&Page

At first, You need add to <i>tag in your tab-title.
If the tab-title name is "TOP", You can add <i> tag with class name. "<i class="h"></i>TOP ".

2:Add CSS code!!
Add CSS code like this,
-----------------------
.h{
    background: url("https://storage.ning.com/topology/rest/1.0/file/get/3240346?profile=original") ;
    display: block;
    float: left;
    height: 16px;
    margin-right: 3px;
    margin-top: 5px;
    width: 16px;
}
-----------------------

You can see "home-icon" in your menu-tab :D

[Example]

This is my code of adding icons...

Icon file: https://api.ning.com/files/kY9puDXSBJbqKFgQOZWGjPvTxdeEQeTAEvCzMW9ZoQ9SAXNuHrnwj4AVGNn0Tre0t8fS*RiFBsxackGCfw8X83srDvAiYaHN/menuicon.png

  • <i class="h"></i> => Home icon
  • <i class="j"></i> => Question icon
  • <i class="s"></i> => World icon
  • <i class="t"></i> => Calender icon
  • <i class="m"></i> => Video icon
  • <i class="k"></i> => Star icon
  • <i class="g"></i> => Direction icon

---CSS Code----------------------------

.h,.j,.s,.t,.m,.k,.g{
    background: url("https://storage.ning.com/topology/rest/1.0/file/get/3240346?profile=original") ;
    display: block;
    float: left;
    height: 16px;
    margin-right: 3px;
    margin-top: 5px;
    width: 16px;
}
.j{
background-position:0 -16px;
}
.s{
background-position:0 -32px;
}
.t{
background-position:0 -48px;
}
.m{
background-position:0 -64px;
}
.k{
background-position:0 -80px;
}
.g{
background-position:0 -96px;
}

---------------------------------------

If you have any question, Please let me know!!

【The site using this TIP :D】

  • Shin Koyamada Foundation




  • Keeping it Real - Susan Boyle

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

Join Ning Creators Social Network

Votes: 0
Email me when people reply –

Replies

  • Wow, I'll have to take a stab at this.  Thank you for sharing Sho Allan.

    • Hi, Kos :)

      Thanks for your reply!!

      I will keep to share NING 3.0 TIPs!!

      good luck,
      SHO

  • NC for Hire

    What on Earth made you think to try a tag in a title? How cool. I would have never in a million years tested something like this. Nice job. =) I hope it's not a quirk, and that it continues to work. Keep us posted.

    • Hi, Jen :)

      Thanks a lot!!! but, be careful!!
      Tab-title has the limit of type digit. so, you can not choose tab-title so longer.
      I will keep to post NING 3.0 TIPs :D

      good luck,
      SHO

      • NC for Hire

        Hi SHO,

        Yeah, I'd rather "watch" on this one. Please keep us posted.

        Thanks,

        Jen

    • This reply was deleted.
  • This reply was deleted.
    • Thank you, Riccardo :D

  • Wow great tip and innovative thank you for share it Sho Allan. Can I add a photo icon?
    • Hi Jelena :)

      Thanks a lot!!
      Yeah, You can add a photo-icon !!

      3229207?profile=originalPlease change one of any icon to 16px/16px photo-icon!!

      good luck,
      SHO

  • This is good stuff...would like to see what kind of applications this could have...

This reply was deleted.
 

Some interesting articles related to community management, digital marketing etc. could be found in our digest. Don't hesitate to leave a feedback so we would know that we should continue :-)

Latest Activity

Bizz replied to Bizz's discussion
Tip: PROFILE THEMES
"Well the Themes are coming along nicely and just added another Gamer Theme. You will notice that al…"
4 hours ago
kostasgr replied to Anastasia_Ning_Support's discussion
Activity feed update
"hi Anastasia !! cool !!  thanks for the update....!  ...That is what is needed..!!"
4 hours ago
Bizz replied to James Slater's discussion
Event Text
"By the way what is the page name for the castings events ?"
8 hours ago
Bizz replied to James Slater's discussion
Event Text
"Yes can do it but not with CSS, going to take a bit of work so give me a while to sort it out as a…"
8 hours ago
⚡JFarrow⌁ and Tavolo Ornitologico are now friends
10 hours ago
kostasgr posted a discussion
RSS does not work ??someone else has a problem  RSS ??????and the speed has dropped a lot  ???
16 hours ago
James Slater replied to James Slater's discussion
Event Text
"Hi thanks for replying back I have 2 event pages on my network page one I need keeping same as it i…"
21 hours ago
Stark and Tavolo Ornitologico are now friends
22 hours ago
Bizz replied to James Slater's discussion
Event Text
"Which part do you want to change ?"
yesterday
James Slater posted a discussion
Hi does anyone know the CSS coding for the event pages? I need to change some text of the CSS codin…
yesterday
Anastasia_Ning_Support replied to Traddie's discussion
Can someone summarise where we are on Ning 3.0 and Ning 4.0
"Hi there!
We are continuing to update and develop 3.0 platform (it has Events feature), and we do n…"
yesterday
Luciano Passaro and Tavolo Ornitologico are now friends
yesterday
More…

Meanwhile, you can check our social media channels