1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.2 Changing Main Background Colour?

Discussion in 'Styling and Customization Questions' started by UKD, Oct 26, 2013.

  1. UKD

    UKD Active Member

    I'm using this code:

    Code:
    #headerMover #headerProxy, #header, #content
    {
    background-image: url('@imagePath/xenforo/background.png') !important;
    }
    However the footer/bottom section of my website has not changed colour and remains the default gray, the rest of the website has changed (top section, and middle section). Is there something I am missing for the footer?

    If anyone knows please let me know. Thanks.
     
  2. Amaury

    Amaury Well-Known Member

    Screenshot?
     
  3. UKD

    UKD Active Member

    I just changed it to a more obvious colour so you can see it easier:

    [​IMG]

    Thanks.

    Background is blue, yet bottom still remains gray.
     
  4. Amaury

    Amaury Well-Known Member

    Where did you change this from? The corresponding color palette item or style property?
     
  5. UKD

    UKD Active Member

    I changed it all through EXTRA.css with the code above, I thought that was the only option?

    I called upon the '#headerMover #headerProxy, #header, #content' and I was wondering what else I needed to call upon to fill in the footer? Is there an easier option?
     
  6. Amaury

    Amaury Well-Known Member

    Yes, indeed.

    Either edit the@pageBackground color palette item or the HTML style property.
     
    UKD likes this.
  7. UKD

    UKD Active Member

    Thanks for pointing me in the direction of the HTML style properties :).

    I managed to get it all done with a combination of the two, as the HTML style properties covered the background but did not cover the heading, so for anyone searching this with a similar issue this is how I did it:

    For the background (minus heading):

    Appearance > Styles > YOUR-STYLE > Style Property Groups > General > Miscellaneous
    Code:
    background-image: url('@imagePath/xenforo/YOUR-IMAGE-HERE.png') !important;
    and then for the heading:

    Appearance
    > Styles > YOUR-STYLE > Templates > EXTRA.css
    Code:
    #header
    {
    background-image: url('@imagePath/xenforo/YOUR-IMAGE-HERE.png') !important;
    }
    
     
    Amaury likes this.

Share This Page