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

Forum

How to add a module background image?

Hi, can anybody share the code for a adding a background image to the modules?As you can see in the pic I attached, I found a code to add an image to the module headers, but now I want the code to add an image to the module's backgrounds.ThanksPS: I am working on making a nice dark black ning layout and if you help me I will share the layout when it's finished.

You need to be a member of Ning Creators Network to add comments!

Join Ning Creators Network

Email me when people reply –

Replies

  • Jeff, do you want to add a different image to each module background or one image that will cover all the module backgrounds.
  • Hi Jeff, just put your code where it says 'put jpg code here'

    /* Module Body Background (Individual Modules) */
    .xg_module_body{
    background-color: transparent !important;
    background-image:url(put jpg code here);
    background-position:center 0px;
    background-attachment:relative;
    background-repeat:repeat;
    border: none;
    }

    Change if you want it to not repeat to repeat:no-repeat;
    or 'relative' to 'fixed' if you want the pic fixed.

    Hope this helps.

    It doesn't always look good with a pic here though I must add. I always put mine in the border headers and enlarge the boxes.
  • Thank you
  • Hi i need help. can any one teach me how to add a different image in each module?
  • Would you mind sharing the code for module header image? I can't figure it out :(
    • /* Module Head Picture and Border */
      .xg_module_head {
      background-color: transparent !important;
      background-image:url(add your picture here);
      background-position:center 0px;
      background-repeat:no-repeat;
      height:45px;
      border: 6px inset #000000;
      }
      • oh wow thank you so much!!!
      • Ok, it iis a dum question but, If i have a picture in my computer what will be the code for the picture? I need to first upload it to the network?
        • You need to upload the picture to a photo sharing site like Tinypic or photobucket Lasse, or you could put it into a comment box on your page via the 'camera icon' and before you hit to leave the comment take the code that comes up.
          • Thanks very much....Another question...this code here that you gave us...

            .xg_module_head {
            background-color: transparent !important;
            background-image:url(add your picture here);
            background-position:center 0px;
            background-repeat:no-repeat;
            height:45px;
            border: 6px inset #000000;
            }

            Add in my test page the image to the About Box and in the Box where my name is, not in the head of the page where the title is. What is happening?
This reply was deleted.

Search the Creators Network

Latest Activity

Poppili replied to Paul Asher's discussion Ning3 Member CSV File
"very clear thanks again Paul"
1 hour ago
lorianne replied to George H. Compton IV's discussion (TIP) Ning 2.0 responsive fullwidth network at any screen resolution. :O Cellphones to TV's ;)
"i tried also removing some modules from columns, thinking something was too large & was pushing the…"
11 hours ago
lorianne replied to George H. Compton IV's discussion (TIP) Ning 2.0 responsive fullwidth network at any screen resolution. :O Cellphones to TV's ;)
"Hi George -   OK, so i wanted this badly enough that I decided to just go for it.  I stripped out A…"
12 hours ago
Strumelia replied to Paul Asher's discussion Ning3 Member CSV File
"I used this Jamroom tool when I went live from my ning to my Jamroom site.  The JR tool sent all 48…"
13 hours ago
Paul Asher replied to Paul Asher's discussion Ning3 Member CSV File
"Ning (rightly) does not include user passwords in their archive or this CSV file, so, on import, ea…"
13 hours ago
Eve Bellator replied to Paul Asher's discussion Ning3 Member CSV File
"Thanks so much, Paul. Question: How will these imported members login? Obviously their profiles are…"
14 hours ago
Anas Ghanim replied to Anas Ghanim's discussion Questions
"Thanks, John :D"
15 hours ago
Anas Ghanim replied to Anas Ghanim's discussion Questions
"I fixed it, never mind :D"
15 hours ago
Anas Ghanim replied to Anas Ghanim's discussion Questions
"Hi George! Thank you for your support.  I noticed today that the code you gave me works for the hom…"
15 hours ago
Paul Asher replied to Paul Asher's discussion Ning3 Member CSV File
"Have had three Ning3 member CSV files now and have successfully imported all of them to test Jamroo…"
15 hours ago
Eve Bellator replied to Paul Asher's discussion Ning3 Member CSV File
"Sent."
16 hours ago
Writer Chick {Diane} replied to Writer Chick {Diane}'s discussion 500 Unexpected Errors tonight ~ Anyone else?
"Yes, all is well this morning. "
18 hours ago
Paul Asher replied to Paul Asher's discussion Ning3 Member CSV File
"A Ning3 user has kindly supplied me with their Member CSV file and using that as a reference I've a…"
18 hours ago
Kos replied to Writer Chick {Diane}'s discussion 500 Unexpected Errors tonight ~ Anyone else?
"Yeah, they're back up"
yesterday
Poppili replied to Poppili's discussion Is it true Ning doesn't convert 2.0 sites to 3.0 ?
"again thank you for sharing your advice. I'll think about a way to do it..."
yesterday
Luke Jones replied to Writer Chick {Diane}'s discussion 500 Unexpected Errors tonight ~ Anyone else?
"Mines alright now :) so you might want to check yours :)"
yesterday
Luke Jones replied to Writer Chick {Diane}'s discussion 500 Unexpected Errors tonight ~ Anyone else?
"Yep me!!, and when i did eventually get on to my site, the activity was missing :/ really not a goo…"
yesterday
Susan left a comment for Susan
"Anyone have a hard time signing in tonight? June 30th, 2015. "
yesterday
Maria Balcells and SSCLUB joined NING NETWORKS EUROPE
yesterday
Simon Farnworth replied to Poppili's discussion Is it true Ning doesn't convert 2.0 sites to 3.0 ?
"Interesting how it always seems to be 'Dustin' that is answering help center queries. He must be a…"
yesterday
More…