Hover and clicked colors

  • Author
    Posts
  • #760866

    realagenda
    Member

    Hello,

    I am working on a private blog with the Enterprise theme. I’d like to change the hover over color as well as the color the menu button has once it’s clicked. I’ve tried several tips from the forum and other websites but I can’t seem to be able to change them. I also followed some threads with people who had the same questions than I do, but again, no luck.

    If anyone can help me with the a website where I can find the code I need to change or knows the code I would appreciate it greatly.

    Thank you,

    Luis.

    The blog I need help with is real-agenda.com.

    #761089

    raincoaster
    Member

    Well, what tips have you tried? We need to know what you’ve tried so we can tell you what to do.

    #761093

    Keep in mind that custom CSS depends on the theme you are using, so the forums you looked at before would have had to have been for Bueno and for the exact same use case you mentioned.

    I looked at http://enterprisedemo.wordpress.com/ as an example. I found what selectors to use by looking at the original stylesheet for Bueno and searching for “hover” in the nav section. Then I copied all of the relevant ones and added new color settings.

    You can change the hover menu colors with this in the Bueno theme:

    .nav ul li a:hover,
    .nav ul li a.selected,
    .nav ul li.current-menu-item > a,
    .nav ul li.current-menu-ancestor > a,
    .nav ul li.current_page_item > a,
    .nav ul li.current_page_ancestor > a,
    .nav ul li ul li a:hover,
    .nav li:hover > a,
    .nav ul ul li:hover > a {
    	background: red;
    	color: yellow;
    	}

    Change red and yellow to the colors you want. See this for more colors.

    I couldn’t see a way to change the background color for visited menu links in Bueno. I’m interested if someone else can do it! :)

    #761096

    realagenda
    Member

    I currently have Bueno, but I created a new blog which is private because I want to “transfer” my website from the Bueno theme to the Enterprise theme once I am done customizing it. The code above looks like the code I saw on the threads. I don’t know why it didn’t work for me. I am aware that code is theme dependent. I have the CSS editor bar from Mozilla and saw the codes related to the hover colors, but when I applied color changes it did not show up on preview.

    I will try this code and see what happens.

    Thanks for being available during this holiday weekend.

    #761113

    realagenda
    Member

    The code provided worked beautifully. After changing the colors, though, there are still the dark grey separators between the buttons which I’d like to change to a different color.

    Would you know the code I’d have to change in order to turn change the color of those dividers?

    #761162

    timethief
    Member

    I currently have Bueno, but I created a new blog which is private because I want to “transfer” my website from the Bueno theme to the Enterprise theme once I am done customizing it.

    All CSS editing is theme dependent and custom design upgrades apply to only a single blog.

    #761168

    The dark grey separator between buttons is an image.

    .nav ul li a {
    background: url("images/navline.png") no-repeat scroll right center transparent;
    }

    #761169

    realagenda
    Member

    Thank you!

    #761172

    You are welcome.

The topic ‘Hover and clicked colors’ is closed to new replies.