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

Happy holidays :-)

The lights will be hanging from the bottom of your Ningbar, see image below.
If you would like to move it up or down just change the 30px in the bottom line of this code. You can also change the background Url to replace the Christmas lights with your own.

Just place this code in your "design studio CSS box".

Ning 3.0


DIV.ningbar.cf:before{
   background-repeat:repeat-x!important;
   content: ","!important;
   position: absolute!important;
   width: 100%!important;
   height: 35px!important;
   left: 0%!important;
   background: url(https://api.ning.com/files/6vIMLmuhUcrLLIL3po0DvpHbBYZ-QctxAE1sy*OqLilWCgFpTnDwYbklBuyggoVNV1mZx1UL1kiqY*gRuxCQoUG1n8w7dlyj/Animation3.gif);
   top: 30px!important; }



Ning 2.0


div#xn_bar_menu:before{
    content: ""!important;
    position: absolute!important;
    width: 100%!important;
    height: 35px!important;
    left: 0%!important;
    z-index:9999!important;
    background: url(https://api.ning.com/files/6vIMLmuhUcrLLIL3po0DvpHbBYZ-QctxAE1sy*OqLilWCgFpTnDwYbklBuyggoVNV1mZx1UL1kiqY*gRuxCQoUG1n8w7dlyj/Animation3.gif);
    background-repeat:repeat-x!important;
    top: 25px!important;}




click here to see it live.

 

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

  •  This is the content of my Custom CSS box - can any expert see something there that would conflict with inserting the above CSS for Ning 3 Lights?

    I am the opposite of an expert - a nexpert!

     

     

    .SP_sign_up{
    text-align:center;
    background:#fff;
    border-radius:3px;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    padding:10px 0;
    }

    .SP_sign_up h4{
    font-weight:bold;
    }

    .SP_sign_up_button{
    padding:7% 10%;
    }

    .SP_sign_up_button a{
    color:#333;
    font-size:16px;
    border-radius:3px;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    padding:5% 15%;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #F8F7F7), color-stop(1, #ECEBEB));
    background:-moz-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
    background:-webkit-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
    background:-o-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
    background:-ms-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
    background:linear-gradient(to bottom, #F8F7F7 5%, #ECEBEB 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F8F7F7', endColorstr='#ECEBEB',GradientType=0);
    background-color:#F8F7F7;
    border:solid 1px #c9c9c9;
    }

    .SP_sign_up_in p{
    font-size:12px;
    }

    .SP_sign_up_external{
    text-align:center;
    }
    .SP_sign_up_external ul{
    padding: 0;
    margin:0;
    }

    .SP_sign_up_external img{
    max-width: 15%;
    }

    .SP_sign_up_external li{
    display: inline;
    list-style: none;
    padding: 2px;
    }

    .SP_sign_up_external > p {
    font-size: 10px;
    }


    /** Like button **/
    .button-tiny.likeButton a .icon{
    display: inline-block;
    width: auto;
    height: 1em;
    overflow: hidden;
    vertical-align:middle;}
    .button-tiny.likeButton a { padding: 2px 4px 5px 7px; }

     

    .status-container {border: 2px groove #fff;padding: 10px;border-radius: 10px;
    background:linear-gradient(to bottom,rgba(255,255,255,1),rgba(0,134,173,.8),rgba(255,255,255,0)), url(//api.ning.com/files/J9FGucqSAtGBsvZjR7FU7RMeW52JmDEyRdxcrgLqW5y0xM4bvNfOyZF0l4gKyZ65z-3XY78WVEj5jnsNJAqz3JPL5gwSGROw/StatusUpdateBackground.png);background-repeat:repeat-x,repeat;background-position:bottom,top;
    -moz-box-shadow: 0px -1px 4px -1px rgba(0, 0, 0, 1) ;
    -webkit-box-shadow: 0px -1px 4px -1px rgba(0, 0, 0, 1) ;
    box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 1) ;}
    .status-body.media-body {border-bottom:none;}
    .js-statusForm.statusForm .button.button-primary {margin-top:10px;}
    .js-statusForm.statusForm .input-full {border: 1px solid #000; border-radius:10px;}
    .statusForm::before {border-color: transparent #000 transparent transparent;}


    .activityFeed-story:hover a.activityFeed-close.activity-close{ display:block; color:red }

     


    /********* VIDEOS PAGES *******/
    /*Remove upload feature*/
    .newVideoPage-page1 div:nth-child(3), .newVideoPage-page1 header.module-header:nth-child(2){ display:none }

     

    /**** search bar remove Ning ****/

    #xn_bar_menu_search{ display:none }

     

    .cht-forwardSymbol::after{content:"Online Now"; margin-left:4px; display:inline-block }

     

    a.dashboardBar-ningLogo,div.dashboardBar-toggleButton.toggle-button,div#dashboardBar,div.dashboardBar-innerSection {background:transparent!important;}

    div.dashboardBarWrap {background:transparent!important;}

     

    • NC for Hire

      .SP_sign_up{
      text-align:center;
      background:#fff;
      border-radius:3px;
      -webkit-border-radius:3px;
      -moz-border-radius:3px;
      padding:10px 0;
      }

      .SP_sign_up h4{
      font-weight:bold;
      }

      .SP_sign_up_button{
      padding:7% 10%;
      }

      .SP_sign_up_button a{
      color:#333;
      font-size:16px;
      border-radius:3px;
      -webkit-border-radius:3px;
      -moz-border-radius:3px;
      padding:5% 15%;
      background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #F8F7F7), color-stop(1, #ECEBEB));
      background:-moz-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
      background:-webkit-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
      background:-o-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
      background:-ms-linear-gradient(top, #F8F7F7 5%, #ECEBEB 100%);
      background:linear-gradient(to bottom, #F8F7F7 5%, #ECEBEB 100%);
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#F8F7F7', endColorstr='#ECEBEB',GradientType=0);
      background-color:#F8F7F7;
      border:solid 1px #c9c9c9;
      }

      .SP_sign_up_in p{
      font-size:12px;
      }

      .SP_sign_up_external{
      text-align:center;
      }
      .SP_sign_up_external ul{
      padding: 0;
      margin:0;
      }

      .SP_sign_up_external img{
      max-width: 15%;
      }

      .SP_sign_up_external li{
      display: inline;
      list-style: none;
      padding: 2px;
      }

      .SP_sign_up_external > p {
      font-size: 10px;
      }

      DIV.ningbar.cf:before{
      background-repeat:repeat-x!important;
      content: ","!important;
      position: absolute!important;
      width: 100%!important;
      height: 35px!important;
      left: 0%!important;
      background: url(https://storage.ning.com/topology/rest/1.0/file/get/9851882874?prof...);
      top: 30px!important; }

      }

      /** Like button **/
      .button-tiny.likeButton a .icon{
      display: inline-block;
      width: auto;
      height: 1em;
      overflow: hidden;
      vertical-align:middle;}
      .button-tiny.likeButton a { padding: 2px 4px 5px 7px; }

      .status-container {border: 2px groove #fff;padding: 10px;border-radius: 10px;
      background:linear-gradient(to bottom,rgba(255,255,255,1),rgba(0,134,173,.8),rgba(255,255,255,0)), url(//api.ning.com/files/J9FGucqSAtGBsvZjR7FU7RMeW52JmDEyRdxcrgLqW5y0xM4bvNfOyZF0l4gKyZ65z-3XY78WVEj5jnsNJAqz3JPL5gwSGROw/StatusUpdateBackground.png);background-repeat:repeat-x,repeat;background-position:bottom,top;
      -moz-box-shadow: 0px -1px 4px -1px rgba(0, 0, 0, 1) ;
      -webkit-box-shadow: 0px -1px 4px -1px rgba(0, 0, 0, 1) ;
      box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 1) ;}
      .status-body.media-body {border-bottom:none;}
      .js-statusForm.statusForm .button.button-primary {margin-top:10px;}
      .js-statusForm.statusForm .input-full {border: 1px solid #000; border-radius:10px;}
      .statusForm::before {border-color: transparent #000 transparent transparent;}

      .activityFeed-story:hover a.activityFeed-close.activity-close{ display:block; color:red }

      /********* VIDEOS PAGES *******/
      /*Remove upload feature*/
      .newVideoPage-page1 div:nth-child(3), .newVideoPage-page1 header.module-header:nth-child(2){ display:none }

      /**** search bar remove Ning ****/

      #xn_bar_menu_search{ display:none }

      .cht-forwardSymbol::after{content:"Online Now"; margin-left:4px; display:inline-block }

      a.dashboardBar-ningLogo,div.dashboardBar-toggleButton.toggle-button,div#dashboardBar,div.dashboardBar-innerSection {background:transparent!important;}

      div.dashboardBarWrap {background:transparent!important;}

    • I would do it this way instead of using the ningbar, this way it does not matter how tall your ning bar is and also will not interfere with any of the links up there while keeping responsive, it's the same effect as it still sits under the ning bar.

      For now you can see it here: https://jr-images.ning.com/activity

      Add you christmas lights image into file manager then copy the link from the file manager and add into the css in the part for background url. The link in the code is to mine so would still work although if I remove or change it then your would to so best add your own link.

      .central-content::before{
      content: " ";
      position: relative;
      width: 100%;
      height: 35px;
      background: url(https://storage.ning.com/topology/rest/1.0/file/get/9861552479?prof...);
      background-repeat:repeat-x!important;
      display:flex;
      }

      This is the image that rosa posted so click on that then save it to your computer ( keep it as a gif ).

      Copy the image into your file manager then once done save the link from file manager and add it to the css replacing the one that is there.

      9861601694?profile=RESIZE_180x180

      jr-images
      jr-images is a demo site
      • Thank you Rosas and Bizz.

        I am afraid I do not understand these instructions.

        I will see if I can do it but I have not used file manager before or saved images etc.

         

        Will let you know if I manage it.

      • OH MY GOD!!!! :D :D :D It worked!!!

         

        I am so pleased. Thank you Bizz and Rosas for your help. I feel like an expert now. Woohoo!!!

         

        Happy Christmas to all, and hopefully we will all have some peace and good health. And time with our families. xxxxx

      • NC for Hire

        9867606286?profile=RESIZE_930x

        I don't use file manager for photos, so if it's a photo I'm not interested even if after I close the box it always stays alive
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

Marly replied to Annabel Gregory's discussion
Reset Password fails
"Just nercoing this because I've had this issue since July. My members don't receive any emails or…"
7 hours ago
Aurora and Alex - Rosas † Negras are now friends
NC for Hire
Nov 29
⚡JFarrow⌁ shared their discussion on Facebook
Nov 29
Steve C replied to Bizz's discussion
Seeing as we have Albums for photos might as well change the look a bit
" That is CLEAN! Great job."
Nov 28
Alex - Rosas † Negras replied to Renato Gelforte's discussion
Date of articles
"The ning Team can't do your job, it's up to you to add the categories and enable the view counter…"
Nov 26
Renato Gelforte replied to Renato Gelforte's discussion
Date of articles
"Thanks a Lot Alex, but I repeat: the Ning support has already answer:The date of the articles is…"
Nov 23
Alex - Rosas † Negras replied to Bizz's discussion
Seeing as we have Albums for photos might as well change the look a bit
"it's strange in mine I don't see differences and they are centered, looking at your member on the…"
Nov 17
⚡JFarrow⌁ replied to Bizz's discussion
Seeing as we have Albums for photos might as well change the look a bit
"Something else seems to be changing as well...  today my member blocks all look like this..."
Nov 16
Bizz replied to Renato Gelforte's discussion
Date of articles
"The show Author tick box has nothing to do with showing the dates, that just puts a little…"
Nov 15
Alex - Rosas † Negras replied to Renato Gelforte's discussion
Date of articles
"if I'm not mistaken there is an article byBizz 
which may be for you to fix the situation"
Nov 15
Renato Gelforte and Alex - Rosas † Negras are now friends
NC for Hire
Nov 14
Renato Gelforte replied to Renato Gelforte's discussion
Date of articles
"Articles! No "post" of Blog!
c'è una differenza sostanziale!Grazie comunque.
I received an answer…"
Nov 14
More…

Meanwhile, you can check our social media channels