Add Body Background To Specific Page

[Jen]

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! =)

 

<style>

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

</style>

 

I searched for this tip and didn't find it. If it's already been added, please let me know.

Enjoy,

Jen

[Jen]

I agree background-image is preferred. I've had some odd issues on Ning with background-image, so have gotten lazy and use background, instead.

[Jen]

I'm not seeing this. Can you show us an example?

[Troy D. Bertrand]

Hey there Jen,

I've done a lot more complicated customization on my network so I thought this would have been a piece of cake but for some reason I can't seem to get a change of background. Is it possible I may have a conflict in my custom css section? 

Thanks

TDB

This is my code:

<style>

body {
background: url(https://api.ning.com/files/Pwzs533TwjHRuCkPHu1*C0HoOzpCwYv30gWPD0GnBzBbm98saEt7V2n8151ycmqmzFt-zaLXhFaipuY2Q7fZUcavQKwNMWni/Untitled.jpg) repeat-vertical scroll 0 0 !important;
}

_

</style>

[J.Pedro Henriques]

Thank you Jen

 

Pedro

[Stan K]

Great tip, however what code do you need to use in order to change the background image on forum, members, blog, other groups pages etc.. ?

[doone]

Thanks, your CSS tips for the pages worked out really well..

[Jen]

Hi Doone, Great! Thanks for the feedback. =)

[Kwaku OwusuAfriyie]

Cool will give it a try

[Shesh Dhar Tiwari]

You can not get the desired result unless you make Header and Module transparent. for example see http://thatsme.in/group/taza_samachar/page/6377873:Page:109860

Of course, i have just tasted and will change the background image to make the text more prominent.

[NING left by lousy service]

Great job!
how do I center the image?

Thanks Jen!