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

What the Ningbar does

It's fixed so it will scroll down the page with you, colored highlights, rounded search query with inset colored highlights, and it's 24% transparent so it looks like colored glass. Six colors to choose from all with the same eye-catching animation.

right click on the image and open in a new tab to get a better view

 the animation will look better then this gif image file

If you don't want it to scroll down the page with you remove the top five lines of the code that look like this

#xn_bar { position: fixed !important;
z-index: 9999 !important;
top: 0 !important;
padding-bottom:8px !important; }
body{ margin-top:30px !important; }

adjusting the code. More than likely not needed

The only adjustments that may be needed on certain networks are the Fifth and sixth line down from the top

they look like this

height: 28px!important;    this will make the bar thicker or thinner..
body {margin-top:30px !important; }  and this will Lower or Raise the page body..

Compatible with newer browsers such as IE 9 & 10, Firefox, Google Chrome, mountain lion pretty much all of them LOL

Placing the code on your network

single Profile
just put the code in your design studio

whole network
Put the code in your NC custom code box, or in a stylesheet, or your main design studio, or even an ad box for your entire network..

"tip" always place the code at the bottom of where ever you're placing the code

choose your color

 

Black       right click on the image and open in a new tab for a full size view


#xn_bar { position: fixed !important;
   z-index: 9999 !important;
   top: 0 !important;
   height: 28px!important; }
body {margin-top:30px !important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/sQOLs80icDy*0jLdh5CeU8VRrNjM5B-KqyYYFB4xvn5a3Dp4Eo3o5oQOJrnBH17de8R3rRWJ5PDcZRomxw5v6*Oip6w7BIWT/Black.gif)!important;
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #000!important;
   -moz-box-shadow:0px 4px 10px #000!important;
   box-shadow:0px 4px 10px #000!important;}
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #000 inset!important;
   -webkit-box-shadow:0 4px 3px #000 inset!important;
   box-shadow:0 4px 3px #000 inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important; }
#xn_bar #xn_bar_menu a {color:#fff!important; }

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Red          right click on the image and open in a new tab for a full size view

#xn_bar { position: fixed !important;
   z-index: 9999;
   background-color:#4a4a4a!important;
   top: 0!important;
   height: 28px!important; }
body {margin-top:30px!important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/nJ43aFllPkKzYQe20JI*CAMEGNfyVb0PRi2Dqs7SSrnL6XMiZLvakgd7AfJOaidGMqoIRln2gvm4xxp55Tx2HGuvNlFVRp9s/Red1.gif)!important;
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #F00!important;
   -moz-box-shadow:0px 4px 10px #F00!important;
   box-shadow:0px 4px 10px #F00!important;}
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #F00 inset!important;
   -webkit-box-shadow:0 4px 3px #F00 inset!important;
   box-shadow:0 4px 3px #F00 inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important; }
#xn_bar #xn_bar_menu a {color:#fff!important; }

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
blue     right click on the image and open in a new tab for a full size view



#xn_bar { position: fixed !important;
   z-index: 9999;
   top: 0!important;
   height: 28px!important; }
body {margin-top:30px!important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/RwWjcregiv9Nexa8cAYZV*kDSqpKOBKbqibKgwJ0leWaXP-a4lvWjauy5MpoPZ*mr4MO-xLKgV5T9-fankSiFEnEKORA7G0R/Blue.gif);
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #00f!important;
   -moz-box-shadow:0px 4px 10px #00f!important;
   box-shadow:0px 4px 10px #00f!important;}
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #00f inset!important;
   -webkit-box-shadow:0 4px 3px #00f inset!important;
   box-shadow:0 4px 3px #00f inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important; }
#xn_bar #xn_bar_menu a {color:#fff!important; }

 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Gray     right click on the image and open in a new tab for a full size view


#xn_bar { position: fixed !important;
   z-index: 9999!important;
   top: 0!important;
   height: 28px!important; }
body {margin-top:30px!important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/Jks8s5*aIX5lpyhphDQhSremU5tHARI8dkScKCzYc62XwMuTT05DoaJbDxlpEQbw9AVDNFw6VkuFnwM6VcGqePFhZIdDf*8B/Gray2.gif)!important;
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #333!important;
   -moz-box-shadow:0px 4px 10px #333!important;
   box-shadow:0px 4px 10px #333!important; }
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #333 inset!important;
   -webkit-box-shadow:0 4px 3px #333 inset!important;
   box-shadow:0 4px 3px #333 inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important; }
#xn_bar #xn_bar_menu a {color:#fff!important; }


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Pink    right click on the image and open in a new tab for a full size view



#xn_bar { position: fixed !important;
   z-index: 9999!important;
   top: 0!important;
   height: 28px!important; }
body {margin-top:30px!important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/FqLP4kNDB8cxw*IAh2875dVL0SSVrYXhj*ayphxjEZqFCGB8ind57bbbBYyf0pgRVb6nWneBoKKc2uU7PK1n-PTYtu5bfMaP/Pinkbe1176.gif)!important;
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #F3F!important;
   -moz-box-shadow:0px 4px 10px #F3F!important;
   box-shadow:0px 4px 10px #F3F!important; }
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #F3F inset!important;
   -webkit-box-shadow:0 4px 3px #F3F inset!important;
   box-shadow:0 4px 3px #F3F inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important;}
#xn_bar #xn_bar_menu a {color:#fff!important; }

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Light blue  right click on the image and open in a new tab for a full size view



#xn_bar { position: fixed !important;
   z-index: 9999!important;
   top: 0!important;
   height: 28px!important;}
body{margin-top:30px!important; }

DIV#xn_bar { background-image: url(https://api.ning.com/files/-tp0SgjuXJ12TuF*0FDiJO5gmlzqQpYwoowBfoPjhO3DwuGtidep5pE104DRqFQI2J63Pg8evA1XI6lPivURrYgXLMwMKhZc/xn_bar_lite_blue.gif)!important;
   background-size:100% 100%!important;
   opacity: 0.76!important;
   border-bottom: 1px solid #fff!important;
   -webkit-box-shadow:0px 4px 10px #03F!important;
   -moz-box-shadow:0px 4px 10px #03F!important;
   box-shadow:0px 4px 10px #03F!important;}
#cse-search-box input,#xn_bar_menu_search_query {border:0 none!important;
   border-radius:12px 12px 12px 12px!important;
   -moz-border-radius:12px 12px 12px 12px!important;
   -webkit-border-radius:12px 12px 12px 12px!important;
   -moz-box-shadow:0 4px 3px #03F inset!important;
   -webkit-box-shadow:0 4px 3px #03F inset!important;
   box-shadow:0 4px 3px #03F inset!important;
   outline:0 none;padding:5px 9px!important;width:135px!important; }
#xn_bar #xn_bar_menu a {color:#fff!important; }

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

      • hahaha!  I saw your reply in the other forum to SE so I was searching for George's code and didn't want to bother you.  Outstanding!  Thank you soooo much.

        • Your most welcome, we all like to share :)

  • WOW! George, you always come out with the best tips!  I don't know how to do this- but Thank you! HHmmm just noticed this says 2012!!!

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

Asumi Carol updated their profile
9 hours ago
Shada Hotel updated their profile
Friday
Howard Sands replied to Mark Thorpe's discussion
NING is broken?
"I am not a techie, I don't understand the first thing about it, but have a HUGE problem with Ning…"
Thursday
Howard Sands replied to Donna MacShoe's discussion
Ning Support phone number for my 20 yr old site
"I hope this helps
Ning  https://www.ning.com/contact-us/
1-855-233-6436 (USA/Canada Toll Free)…"
Thursday
Donna MacShoe posted a discussion
I am completely locked out of my NING site that I have had for 20 years.  ladiesofthehat.org.  When…
Wednesday
Joven left a comment on Ning Networks en español
"Zzz..."
Wednesday
Ron updated their profile
Nov 25
Ron updated their profile photo
Nov 24
Mark Thorpe posted a discussion
I've run networks based on this platform in the past and never have I seen it in such dissarray as…
Nov 20
⚡JFarrow⌁ liked Bizz ( John )'s discussion How To Create Unlinked Pages In Groups Easily
Nov 15
Suave liked Suave's profile
Nov 15
Suave updated their profile photo
Nov 14
More…

Meanwhile, you can check our social media channels