Home>Support>Highlight Single Menu Item

Highlight Single Menu Item

By Sean, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I have one specific menu item to which I’d like to call particular attention, by changing the color to distinguish it from other menu entries. Is there a way to do this?

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

  1. 10 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Hi Sean

    If you send through a link to your site and let me know which menu item it is, we can help with a little Custom CSS.

  2. 10 years, 10 months ago Sean

    Thanks, Andrew. The site is: http://www.wiotx.com/

    The Menu item is the “Book Now” entry. We would like the ability to change the color separately from the rest.

  3. 10 years, 10 months ago andy-shandy

    Hey Sean,

    While you are waiting for the Andrew’s response I would like to ask you about the following:

    How did you manage to make such an announcement?

    http://joxi.ru/Dr8WKGJcPdPXA6

    Regards

    Andy

  4. 10 years, 10 months ago Andrew Misplon
    Hi, I Work Here

    Sean please try the following under Appearance > Custom CSS:

    /* Menu */

.main-navigation ul li.menu-item-358 a {
background: #000;
color: red;
}

.main-navigation ul li.menu-item-358:hover > a {
background: #fff;
color: blue;
}

    Edit the colors as required.

  5. 10 years, 10 months ago Sean

    Andrew is correct, that is the plug in we used. Very easy, and very customizable. I like that it allows me to predefine dates for the bar to start running and then expire.

  6. 10 years, 10 months ago Sean

    Thanks, Andrew. Unfortunately, the custom CSS page doesn’t seem to have a space where I can enter code. It looks like this:

    https://dl.dropboxusercontent.com/u/37700323/Screen%20Shot%202015-02-08%20at%205.32.58%20PM.png

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

    Mmm that’s no good. Perhaps try temporarily de-activating all non-SiteOrigin plugins and check if there is any change to the Custom CSS window. If not you could try Simple Custom CSS as a hotfix:

    https://wordpress.org/plugins/simple-custom-css/

  8. 10 years, 10 months ago Sean

    This worked great, though I had to use simple CSS until I have time for more troubleshooting. Thanks for the assistance.

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

    Super, glad to hear you made progress here :)

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