Home>Support>Vantage footer
  1. 9 years, 8 months ago Marcel K.

    Hello Garrick,

    to change the color of the footer, copy and paste that into CustomCSS:

    #colophon {
background-color: #fcfcfc;
}

    Use your own hexcolor instead of #fcfcfc.

    To change the color of the menu, you can use this code (also in CustomCSS):

    .main-navigation ul {
background-color: 'fcfcfc;
}

    Use your own hexcolor, again.

    To change the color of the search-div, use:

    #search-icon #search-icon-icon {
background-color: #fcfcfc;
}

    Also change the fcfcfc to your own color.

    Hope that will help you :)

  2. 9 years, 8 months ago Garrick Erasmus

    hmm and how bout to add a background image in the footer?

  3. 9 years, 8 months ago Marcel K.

    Try it with:

    #colophon {
background-image: url(your_image-url_here);
}

    Replace the “your_image-url_here” with a url like “http://example.de/image.png”. Don’t forget the file format like “.png” or “.jpg” at the end of the url.

  4. 9 years, 8 months ago Garrick Erasmus

    marcel cant get it to work

  5. 9 years, 8 months ago Garrick Erasmus

    [
    #colophon
    background-image: url(http://www.mazuga.com/wp-content/uploads/2015/01/footer_bg.jpg);

    ]

  6. 9 years, 8 months ago Marcel K.

    Did you copy the exact thing like I wrote? Your last Post isn’t correct. You forgot the “{” and the “}”.
    If it isn’t working, try that

    #colophon {
background-image:  url(your-url-here) !important;
}

    If that won’t work, try to set the color of the footer to transparent.

  7. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Hi Garrick

    Thanks for reaching out. These are all options in Vantage Premium, if you’d like to check out that offering, please head to Appearance > Vantage Premium.

    Marcel! Thanks man, really appreciate the hand here.

    Garrick remember to use a Custom CSS plugin like Jetpack Custom CSS or Simple Custom CSS and not Appearance > Editor.

    Marcel has you all sorted here but I’m just going to paste the selectors you’ve asked about as a reference:

    /* Vantage Menu Colors */.main-navigation {background: #343538;}.main-navigation a {color: #e2e2e2;}.main-navigation ul li:hover > a {background: #00bcff;color: #FFFFFF;}/* Vantage Menu Search Icon Colors */#search-icon #search-icon-icon .vantage-icon-search {color: #d1d1d1;}#search-icon #search-icon-icon:hover {background-color: #00bcff;}/* Vantage Footer Background Color */#colophon {background: #2f3033;}/* Vantage Footer Background Image */#colophon {background-image: url("");}
Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More