Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #17733
    Natekj
    Member

    Im trying to change the color of the Current sub menu. I have changed the color of submenus that are not the current selected one.

    I also have changed the the color of the currently selected page menu.
    But I cant get the currently selected submenu to be the color I want. Its always staying the same color as the currently selected page menu.

    Please help, Ive been here hours…

    #17740
    Sakin
    Keymaster

    @Natekj: Sorry I don’t understand what you mean. Can you post in your site URL and explain in reference to your site. So, that I can understand what you have done and what you want to do it next.

    #17741
    Natekj
    Member

    http://www.phoneandtabletreviews.com/

    Click on one of the pages on menu. Some have submenus.

    But the selected submenu background color is the same as the menu bar page background (once its been selected)

    #17744
    Sakin
    Keymaster

    @Natekj: Do you mean to change the Sub Menu current menu item, then you can use the following CSS in “Appearance => Theme Options => Custom CSS” box.
    #header #mainmenu ul.sub-menu li.current-menu-item { background-color: #fff; }

    #17745
    Natekj
    Member

    Thanks for the reply.
    I tried that code but it does not change the submenu current background color

    if you click on 1,2 or 3 the entire submenu is still orange. I need it black but the page 1,2 or 3 that you selected first of all needs to be orange still.

    #17747
    Natekj
    Member

    Thanks for the reply.
    I tried that code but it does not change the submenu current background color
    if you click on 1,2 or 3 the entire submenu is still orange. I need it black but the page 1,2 or 3 that you selected first of all needs to be orange still.

    #17754
    Natekj
    Member

    I still cant get this done after hours of trying and using chrome dev tools. Im missing something simple. Appreciate any help

    #17761
    Sakin
    Keymaster

    @Natekj: I see that you are changing in core style.css which is not recommended at all. Either you need to change CSS from “Custom CSS” box in Theme Options panel or you need to change it by build child theme. As all the changes that you made on core theme files will be reverted back to original when you update the theme.

    So, first revert back the original style.css

    Then following CSS in supposed to be add in “Appearance => Theme Options => Custom CSS” box, which will change the sub menu current item background color to white.
    #header #mainmenu ul.sub-menu li.current-menu-item a { background-color: #fff; }

    #17768
    Natekj
    Member

    Im actually using a child theme. I have a child folder and child css with the template linking back to simple-catch folder :s

    I done what you said putting into the custom css and deleting everything in my child theme style to double check if it works. It didnt so im left stumped and been at this little problem for hours :/ whats going wrong. My child theme style css is empty of any code. So all the code loaded should be from the original simple-catch… But it still doesnt work

    http://postimg.org/image/e026qrqkz/

    [img]http://postimg.org/image/e026qrqkz/[/img]

    As you can see in the picture, the currently selected menu page is giving the currently selected submenu the same color. I would like them different colors

    #17771
    Natekj
    Member

    Also, I havent done any editing of the original style css in the original parent simple-catch folder.

    What I just done to double check is activate the simple-catch theme (not my child) and put that code you wrote in the custom css box and saved. It still doesnt work and gives the same outcome as the picture above.

    #17773
    Natekj
    Member

    Ive tried so many ways of doing this. Ive looked through so many forum topics on many forums and come to the conclusion that in style.css this theme does not allow different color for a sub menu, once the a top menu has been selected.

    #17794
    Sakin
    Keymaster

    @Natekj: If you check in your site now and go to the page 7 under 2, that is http://www.phoneandtabletreviews.com/category/amazon-kindle-reviews/amazon-kindle-fire-hdx-8-9-review/. You will see the background color of current menu item 7 as white background. This shows the code is working.

    #17801
    Natekj
    Member

    Ah right, I think I havent explained it right. Im new :/ I mean the background of the submenu after selection of a top menu item.

    Example click on 1 and background turns grey, which then shows 4 and 5 as submenu with the background thats grey. Its the background of 4 and 5 (without clicking on them) that i want as a different color rather than grey.

    #17810
    Sakin
    Keymaster

    @Natekj: Yes all confusing. So, can you add in the following CSS in “Appearance => Theme Options => Custom CSS” box.

    /* Sub-menu of Current Menu */
    #header #mainmenu .current-menu-item .sub-menu a { background-color: #fff;  color: #000; } 
    /* Sub-menu of Current Menu at Hover state */
    #header #mainmenu .current-menu-item .sub-menu a:hover { background-color: #000;  color: #fff; }
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Current sub menu color’ is closed to new replies.