Home>Support>Change font of text in menu widget in masthead
  1. 9 years, 9 months ago Andrew Misplon
    Hi, I Work Here

    Hi matabra1111

    Try the following under Appearance > Custom CSS:

    /* Vantage Header Custom Menu Widget */

#header-sidebar .widget_nav_menu ul li {
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
font-size: 14px;
}
  2. 9 years, 9 months ago matabra1111

    Thank you.

    Can I add effects like hover colour etc?

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

    Sure. Links look like so:

    #header-sidebar .widget_nav_menu ul.menu > li > a {
  text-decoration: none;
  color: #555555;
}

    And the hover for those links:

    #header-sidebar .widget_nav_menu ul.menu > li:hover > a {
  text-decoration: none;
  color: #555555;
}

    Un-tested so try it out, see how it goes.

  4. 9 years, 9 months ago matabra1111

    That worked perfectly, thanks. Do you have the code for second level hover?

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

    Sure. Try the following:

    #header-sidebar .widget_nav_menu ul.menu > li ul.sub-menu li a {
  color: #777777;
}
#header-sidebar .widget_nav_menu ul.menu > li ul.sub-menu li a:hover {
  color: #777777;
}
#header-sidebar .widget_nav_menu ul.menu > li > ul.sub-menu {
  border-top: 2px solid #00bcff;
}
  6. 9 years, 9 months ago matabra1111

    One more: Can I get the menulink to a page that is currently active to stay in a color I choose?

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

    Sure, try the following and edit as required:

    .widget_nav_menu ul li.current-menu-item > a, .widget_nav_menu ul li.current_page_item > a { color: #000000; }
    • 9 years, 9 months ago matabra1111

      Same thing for sub menu(when hover) window?

  8. 9 years, 9 months ago matabra1111

    Thanks!

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

    Try:

    .widget_nav_menu ul.sub-menu li.current-menu-item > a, 
.widget_nav_menu ul.sub-menu li.current_page_item > a { color: #000000; }
  10. 9 years, 9 months ago matabra1111

    #header-sidebar .widget_nav_menu ul.sub-menu li.current-menu-item > a, .widget_nav_menu ul.sub-menu li.current_page_item > a {
    color: #f47e3c; }

    Did not work. Also when I Applied, it removed the current link color function…

    • 9 years, 9 months ago matabra1111

      That worked. Can I also get the link that is the main one (the one that the submenu is Connected to) in color when active? Sum: I get color one the current linkpage, and also color on the link in that submenu thats is active..?

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

    Try:

    #header-sidebar .widget_nav_menu ul.menu > li ul.sub-menu li.current-menu-item a {
color: red; 
}
    • 9 years, 9 months ago matabra1111

      matabra1111

      That worked. Can I also get the link that is the main one (the one that the submenu is Connected to) in color when active? Sum: I get color one the current linkpage, and also color on the link in that submenu thats is active..?

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

    Try the following:

    #header-sidebar .widget_nav_menu ul.menu > li.current-menu-parent a,
#header-sidebar .widget_nav_menu ul.menu > li ul.sub-menu li.current-menu-item a {
color: red; 
}
  13. 9 years, 9 months ago Andrew Misplon
    Hi, I Work Here

    For sure.

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