(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14

[George H. Compton IV]

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.

 

[Kos]

Here's a code with different lights from soaringeagle here https://creators.ning.com/forum/topics/simple-holiday-decoration

For 2.0
#xn_bar,.xg_theme .xg_module_head {background-image:url("http://webdeveloper.com/animations/holiday/christmas/gifs/xmas_light.gif");background-repeat:repeat-x;}

For 3.0
.ningbar {background-image:url("http://webdeveloper.com/animations/holiday/christmas/gifs/xmas_light.gif");background-repeat:repeat-x;}

Enjoy!

[Anam]

Thanks, Kos :)

[Kos]

Want some snow?  Place this in Custom Code

<script type="text/javascript" src="https://storage.ning.com/topology/rest/1.0/file/get/549334?profile=original
"></script>

[dave]

Thanks for the snow Kos :-)

[Brian]

Where do you put this code, and how do I know whether I have ning 2.0 or 3.0?

[Anam]

You open Design Studio in the top tool bar and insert it into Custom CSS code and Publish.

I don't know how to tell if you have a Ning 2 or 3, sorry.

[Kyryl_Ning_Support]

You have 2.0 (if we are talking about the network on your profile)

Anam is right, just wanted to add the link to the help center article. It has screenshots that might help you to locate the place to insert the code.

Best wishes,

Ning Team.

[George H. Compton IV]

Hello Brian, I hope you like the lights. :-)

[dave]

Thanks George :-) i love christmas and to be able to jazz up your site is great :-)

[George H. Compton IV]

Thank you Anam, Kos and Dave...  Merry Christmas everyone! :)