Tagged: , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • December 16, 2015 at 10:29 am #553540
    sackerly

    Hi, I am trying to highlight an item on a submenu.

    The goal is something similar to highlighting a main menu item, as described here: https://kriesi.at/support/topic/highlight-menu-items/

    I used the code to highlight an item on the main menu of my site: http://highpeaksmedia.com (menu item Websites)

    I would like to do something similar for an item in the submenu above the main menu (e.g., for Pricing).

    Can you help with the code for this – thanks!

    December 16, 2015 at 3:09 pm #553709
    Yigit

    Hi sackerly!

    Please add following code to Quick CSS 

    .sub_menu li.current-menu-item a {
    background: red;
    color: white;
    padding: 5px;
}

    Best regards,
    Yigit

    December 16, 2015 at 4:31 pm #553798
    sackerly

    Ah … I modifed the code you sent and achieved my goal, of a globally highlighted sub menu item:

    .sub_menu li#menu-item-7222 a {
    background: red;
    color: white;
    padding: 5px;
    border-radius: 5px;
    }

    Thank you! One more question – is there a way to eliminate the highlighting of child pages in the drop-down menus, both on items highlighted in the the main menu (as per https://kriesi.at/support/topic/highlight-menu-items/) and on items highlighted in the submenu (as per above). (What I am trying to achieve is a ‘Call to Action’ of sorts – i.e., globally highlighted menu items, but without highliighting of chid pages.) Thanks!

    December 16, 2015 at 4:45 pm #553813
    Yigit

    Hi!

    Please change your code to following one 

    .sub_menu li#menu-item-7222 > a {
background: red;
color: white;
padding: 5px;
border-radius: 5px;
}

    Cheers!
    Yigit

    December 16, 2015 at 6:31 pm #553919
    sackerly

    That worked perfectly – thank you!

    How would I modify the code for the main menu item, to also eliminate child pages from the shading?

    Currently, the code reads

    li#menu-item-8296 .avia-menu-text {
    padding: 5px;
    background-color: red;
    color:white;
    border-radius: 5px;
    }

    December 16, 2015 at 6:38 pm #553923
    Yigit

    Hi!

    Please change it to following 

    li#menu-item-8296 > a > .avia-menu-text {
padding: 5px;
background-color: red;
color:white;
border-radius: 5px;
}

    Best regards,
    Yigit

    December 16, 2015 at 6:50 pm #553930
    sackerly

    Perfect – thank you!!

    I would like to use this format for Calls to Action (not on my website but on client websites) – the submenu is visible on mobile views.

    I appreciate all the help. Have a great day :)

    December 17, 2015 at 7:12 am #554227
    Rikard

    Hi,

    Glad we could help, please let us know if you should need any more help on the topic.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.