Plus and Pro Subscribers

How To: Add Body Background To Specific Page

  • Go to new or existing page /pages.
  • Access the specific page.
  • Click on Top Right Menu - Options/Edit.
  • If you haven't customized the page yet by utilizing the new Advanced Features,
  • - -> Check box next to Meta: Manage title and meta tags manually (advanced)




  • Add your CSS styles in Custom Box.
  • For any CSS style, wrap in style tag. <style>your custom css for specific page </style>
  • Upload your background image via File Manager or a Blog.
  • Copy the image URL.
  • Edit code below, and replace your_image, with your image URL.
  • Be sure to use repeat-x (horizontal repeat) or repeat (repeat horizontal and vertical), if needed for your background image.
  • Click on Update Page.
  • Done! =)



body {
background: url(your_image) no-repeat scroll 0 0 !important;




Tags: add background to page, background, background image, page, page background

Views: 576

Replies to This Discussion

Great thanks!  

Kinda unrelated, but I've been going through my pages and adding <meta name="keywords" content="keywords related to my page">  to the meta description box.  Am I placing them in the right place to be effective?


You're placing them in the right place, but the question is: do we just enter the words, or the full meta tag? Honestly, I don't know. When I test this, I'll let you know. Before you enter a lot though, I'd ask Ning. One way would be to view source on the page, and make sure the meta tags look right.



I just looked, DOH. You add the entire meta tag. ;-)
Cool thanks!


My pleasure, easy tip really. Did you receive your notification about the new VIP tip? You'll probably appreciate this one in particular:



Hey Jen,   I didn't know this obviously, but looks like I'm wasting my time adding metatag keywords


Hey Katie,

I don't agree. And this is why. Those keywords will help on searches, in a huge way. Here's the deal though. They don't seem to be "taking". The other day I could have SWORN I was adding keywords directly in the meta description box like this:

<meta name="keywords" content="dfp on ning, ning ads,  serving ads on ning, manage ads on ning" />

Now today, just a bunch of gibberish when I save and view page source. What about you? Am I just tired and doing something really blonde? ;-)




Glad to know your thoughts on their effectiveness, I will keep adding them.

Mine is there when I view source.  Its the last line before the </head>

Its not putting it up with the other metatag stuff though, does that matter?


Jen, I did NOT understand what this feature did when it was announced by Ning, but YOUR instructions have made everything all clear! I tried this and I LOVE IT!!

One question: Every image I add to the background is too narrow (and I'm using wallpaper sized images). Do you know the exact width the image has to be? For example, your blue sky/cloud one is the perfect size and would work on my pages.

SQUEE! Love this tip and I'm so excited to spruce up my pages! Now I just need that size! :)

Glad the overall instructions helped. It gets really complicated on widths, sorry to say. It's due to all resolutions. My clouds are repeated in the horizontal direction with repeat-x. And here's the kicker, they have to be a "seamless image", meaning that they repeat without jagged edges. I created the clouds from scratch, and even for me it was a bugger to make them seamless.

Sorry, wish I could help more. It is different for every case. For example, on PetBrags I have an image at top and faded it out gradually at bottom. Then I use a background color, using repeat-x only for image. My background is the same color as bottom of image. This way it has a smooth transition at bottom. You can try a huge image that is wide enough for all resolutions, but can take a good deal longer to load. It's a real art to get background images to flow correctly.


Bottom line: if you're using a tiled image, it's already seamless in most cases, and you use "repeat". Otherwise, you have to Google seamless, and really work with it.



If I were to use a rather plain background (no images, just a vague texture type image) what code would I insert to tile it?


You say no image, but you say image, lol.

body {
background: url(your_image) repeat scroll 0 0 !important;


Need a Self-hosted Ning alternative?

The SocialEngine Team has created an Import Tool for Ning 2.0 Sites.
Self-hosted & 100% White Label:
SocialEngine PHP is hosted on your own server where you have complete control over your community.

Blog Posts

Replacement Laptop Key Brands

Posted by Replacement Laptop Keys on October 12, 2015 at 5:14am 0 Comments

As you may know, there are a number of brand names or makes for laptop computers. Furthermore, there are several laptop models that pertain to each brand. It is important to keep this in mind if you ever have to seek out a replacement part or…


Gum Disease Treatment

Posted by Discovery Dental WA on October 1, 2015 at 5:43am 0 Comments

Treating gum disease can be accomplished in a number of ways, and whether it'll be an easy or difficult task depends on several things, beginning with one's health. There are a variety of treatments for gum disease depending on its severity, your…


About - Fidelus Technologies LLC

Posted by Fidelus Technologies LLC on September 29, 2015 at 1:31am 0 Comments

About - Fidelus Technologies LLC

We are Fidelus. We make the complex simple. Fidelus Technologies LLC is a leading provider of Cisco Unified…


Three Things You Can Do to Get More Out of Cisco WebEx

Posted by Fidelus Technologies LLC on September 28, 2015 at 5:26am 0 Comments

Summer is almost here. And for today’s corporate workforce that often means more frequent work-from-home days, working vacations and other circumstances that call for a WebEx meeting. With that in mind, we thought it might be a good time to…



© 2016   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

VIP Ning Tips