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.

Featured Discussions

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

Ana Massien replied to Ana Massien's discussion
Some recent suggestions for ning 3.0
"Yeah, well just some thoughts I have had."
2 hours ago
Garfield Archivist replied to ⚡JFarrow⌁'s discussion
2 Secret Things I learned today about Ning Communities
"Nice!"
3 hours ago
DYLAN GOODWIN updated their profile
18 hours ago
DYLAN GOODWIN replied to Scott Bishop's discussion
Photo Slideshow Not Rendering Correctly
"Speaking of slideshows -- isn't it time for more options on the sizing to eliminate the un-attracti…"
18 hours ago
This Is bully replied to Ana Massien's discussion
Some recent suggestions for ning 3.0
"Ha good luck it’s been over 8 months no new updates only promises "
20 hours ago
Claire Thomas and Ralph Stokes joined Ning Creators Social Network
21 hours ago
Ana Massien commented on Steve C's blog post To Ning's CEO
"Isn't that kind of rude to ask for the ceo stuff right out right? Most people surf with protected p…"
yesterday
Ana Massien replied to Anastasia_Ning_Support's discussion
Welcome Landing Page Builder
"I do not like the landing page thing. Doesn't flow with the rest of my theme, of course if you have…"
yesterday
Ana Massien updated their profile
yesterday
Ana Massien updated their profile photo
yesterday
Ana Massien posted a discussion
 1. On the front page, instead of going into the admin function to edit the boxes, could there poss…
yesterday
Anastasia_Ning_Support posted a discussion
Hi NING Creators! 

Due to the scheduled PayPal maintenance, today you may experience certain diffi…
yesterday
More…

Meanwhile, you can check our social media channels