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

FORUM

NC for Hire

Add Text Before or After Module Headers

I just had a member on JenSocial ask this question, and thought it warranted a great quick and dirty CSS tip.

 

He wanted to change his home page Video Module title to "Featured Videos". When he changed via the Language Editor, it got confusing and was changed in more places than he wanted.

 

Here's a nice way around a situation like this. You can use the CSS property called: content, to add text or an image, before or after any CSS element. For example in this case:

 

Add this code to your Advanced CSS, via My Network/Settings/Appearance:

.xg_widget_main .module_video .xg_module_head h2:before {content:'Featured ';}

 

This will change your Video Module header from Videos to Featured Videos.

 

You can also add images. A nice place to do this on a Ning site is before or after the main page headers. You need to add a small image, like an icon 16 by 16. Here's the example code:

 

.xg_headline .tb h1:before { content: url(yourimagelink); }

 

Enjoy,
Jen

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

Join Ning Creators Social Network

Email me when people reply –

Replies

  • THANKS..nice tip

  • BIGGGGGGGGGGGGGGGGGGGGGGGGGG

     

    Great tip, still can find the modules for activity, groups, leaderboards but it works fine with blog posts, events, forum and videos...

     

    thank you for that

  • thanks, Jen! i had that same issue with Featured Videos and now i can change it.

  • NC for Hire

    Happy to hear this is helpful to you all!

    Best,

    Jen

  • Hi Jen. You shared a tip a while ago for adding images in module headers... I tried to find it with no luck :(
  • Great trick, thanks for sharing. Is there a bit of code that will actually replace the title with this text?

    For example, rather than the app box on the Main Page reading "Blog Posts" I'd like to change it entirely to "Member News."

     

     The before: and after: operators are useful- but how do you replace :)

This reply was deleted.

Announcements

 

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

Linda Hertz liked Anastasia_Ning_Support's discussion Join our new webinar on August 22nd!
28 minutes ago
Stuart Alexander replied to Anastasia_Ning_Support's discussion
Migration FAQ
"Like Adrian, I am not finding the amount of storage I am using. It does not show up as in the examp…"
1 hour ago
This Is bully replied to Lauren's discussion
Looking to Monetize and Improve Engagement
" LOL It happened to a very active member of mines every post they made sent it to spam so I created…"
2 hours ago
Lauren posted a discussion
Hello,Please take a look at our page www.booktown.ning.com, we're looking for ways of increasing me…
5 hours ago
Fred St Laurent replied to Anastasia_Ning_Support's discussion
Step-by-step migration guide
"I would like to see this list as well please."
7 hours ago
PAT Diabetes liked marie's discussion Help please with forums and groups
10 hours ago
PAT Diabetes updated their profile
10 hours ago
ICM Redactie, COIFFURANCE, Gwendolyn LaFae and 7 more joined Ning Creators Social Network
11 hours ago
Ambroise liked J.Ayvar's discussion We need this in Ning 3.
12 hours ago
Ambroise replied to Anastasia_Ning_Support's discussion
Step-by-step migration guide
"Is there somewhere a list of these features that are not supported on 3.0?"
12 hours ago
J.Ayvar posted a discussion
This feature  is so important for 2 reasons.1.- Personal Welcome Message (user name mentioned)2.- N…
12 hours ago
Josie Chen updated their profile
16 hours ago
More…

Meanwhile, you can check our social media channels