Home>Support>Menu Colors

Menu Colors

By Nico Malassa, 9 years ago. Last reply by Andrew Misplon, 9 years ago.

Hello,

i tried to change the colors of the menu and followed the steps as described in the documentation.

i can’t find the “Select Color” button there.

My WP is 4.3 and have the updated version of the Theme Vantage.

thank you vor your help in advanced.

Regards
Nico

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 1 month ago Nico Malassa

    i found it there ist one more step Appearance > Customize >Theme> Menu that is the right path ;-)

    Regards
    Nico

  2. 9 years, 1 month ago Nico Malassa

    anyway i have now another Question:

    i have a Menu with 8 Menu-Items for different Departments. Those Departments have different Collors

    example: Informations = #666666, Money = #0087c1 etc….

    is it possible to set for each Department a separate Color for the Background and Hover?

    thank you very much
    Nico

  3. 9 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    Hi Nico

    Thanks for your support.

    Apologies for the hassle. That’s right, the Vantage theme customisations can be found at Appearance > Customize > Theme Design.

    It’s not possible to set each menu item’s background color from within the theme settings or Customizer. However, we could assist using Custom CSS. Once you have everything setup correctly, please, send us a link to your site and we’ll help out.

  4. 9 years, 28 days ago Private Message - Nico Malassa

    This is a private message.

  5. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    Thanks Nico

    I’m able to change menu colors. I quickly changed the menu background from grey to blue. Are you not able to do this?

    The Customizer isn’t loading its preview window. This is a problem. It’s either due to a plugin conflict or perhaps a PHP memory shortage (guessing).

    I’ll post in a moment how to check for a plugin conflict.

  6. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    How to test for a plugin conflict in the Customizer.
    Note: the problem is no preview is appearing to the right of the Customizer controls. When we say “the issue” below, we are talking about no preview occurring in the Customizer.
    Run the test with two tabs open. One in the Customizer and another working with plugins.

    This sounds like it could be a plugin conflict issue. Can you try disabling all non-SiteOrigin plugins and see if this fixes the issue? If it does fix the issue, then try re-enabling your plugins one by one until the issue comes back. This procedure will help diagnose which plugin is causing the issue.

    Once we know that, we’ll be able to look at what might be causing the conflict and either solve the problem or help you find an alternative plugin.

  7. 9 years, 28 days ago Nico Malassa

    you can see at the home page the first 4 top points Geld, Essen & Trinken, Wohnen, Beratung

    this 4 Points i want have in the menu in that color it have at the Icons.

    exp: i go with the mouse to the menu “wohnen” and the mouse over should change than only for that “Wohnen” Menu in the right color.

  8. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    Not quite sure I’m following you there. The jump that is happening on hover is coming from the following:

    .main-navigation ul ul li:hover > a {
  width: 250px;
}

.main-navigation ul li:hover > a {
  width: 250px;
}

    Go to Appearance > Custom CSS and remove those rules. The hover issue will be resolved.

  9. 9 years, 28 days ago Private Message - Nico Malassa

    This is a private message.

  10. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    There is unfortunately no way to do this from within the theme, I’ll try work up some CSS for you in a moment.

  11. 9 years, 28 days ago Nico Malassa

    that would be great to do that for the Future ;)

  12. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    Sure, here we go:

    /* Main Menu */

/* Item One */
#menu-item-55 a {
	background: #000;
}
#menu-item-55 a:hover {
	background: #fff;
}

/* Item Two */
#menu-item-37 a {
	background: #000;
}
#menu-item-37 a:hover {
	background: #fff;
}

/* Item Three */
#menu-item-70 a {
	background: #000;
}
#menu-item-70 a:hover {
	background: #fff;
}

/* Item Four */
#menu-item-65 a {
	background: #000;
}
#menu-item-65 a:hover {
	background: #fff;
}

/* Item Five */
#menu-item-114 a {
	background: #000;
}
#menu-item-114 a:hover {
	background: #fff;
}

/* Item Six */
#menu-item-118 a {
	background: #000;
}
#menu-item-118 a:hover {
	background: #fff;
}

/* Item Seven */
#menu-item-122 a {
	background: #000;
}
#menu-item-122 a:hover {
	background: #fff;
}

/* Item Eight */
#menu-item-126 a {
	background: #000;
}
#menu-item-126 a:hover {
	background: #fff;
}

/* Item Nine */
#menu-item-187 a {
	background: #000;
}
#menu-item-187 a:hover {
	background: #fff;
}

/* Item Ten */
#menu-item-263 a {
	background: #000;
}
#menu-item-263 a:hover {
	background: #fff;
}

    Delete the rules you don’t need.
    Adjust #000 to the background color required and #fff to the hover color required.

  13. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    Insert at Appearance > Custom CSS.

  14. 9 years, 28 days ago Nico Malassa

    Hi Andrew,

    great thats what i wanted ;)

  15. 9 years, 28 days ago Andrew Misplon
    Hi, I Work Here

    Super :) Glad we could help out.

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