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, 5 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, 5 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, 5 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, 5 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, 5 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, 5 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, 5 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, 5 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, 5 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