Okay
  Public Ticket #1041482
Menu item color and icon
Closed

Comments

  •  2
    Yorick started the conversation
    January 30, 2017 at 1:45pm

    Hi, some time ago my menu stopped showing as intended. After updating the theme to the latest version.

    1) The arrow next to a menu item with sub menu is gone. 

    2) The background color of certain menu items was orange (menu item 'Kies Locatie' and 'Mijn VIP'. I got this working with this css, but is no longer working:

    /* Solid menu item background orange */
    header#top nav > ul > li.button_solid_color > a:before, #header-outer.transparent header#top nav > ul > li.button_solid_color > a:before {
        background-color: #FF5722 !important;
    }

    /* Solid menu item text color white on active */
    #header-outer:not([data-lhe="animated_underline"]) header#top nav .sf-menu li.button_solid_color > a, #header-outer:not([data-lhe="animated_underline"]) header#top nav .sf-menu li.button_solid_color > a {
        color: #ffffff !important;
    }

    Could the new theme update have caused this to stop working? Can you help me fix this?

    -------

    Edit: It seems the options in Customizer > Menu's and Appearance > Menu's for changing a menu item to a 'solid button' are no longer there since the update.

  •   Yorick replied privately
  •  8,455
    Tahir replied
    January 30, 2017 at 3:00pm

    Hey Again,

    Try changing the Skin in Salient Theme Options Panel -> General Settings  to get the Arrows back . 

    Also see " WP 4.7 Bug | Menu Item Style not showing in Menu Options in WP Dashboard . 

    Be.st


    ThemeNectar Support Team 

  •  2
    Yorick replied
    January 30, 2017 at 11:39pm

    Thank you!

    I used this code and my menu items are now solid again:

    <script type='text/javascript'>
    jQuery( document ).ready(function() {
    jQuery('#menu-item-576, #menu-item-38, #menu-item-156, #menu-item-613, #menu-item-163, #menu-item-586, #menu-item-170, #menu-item-604, #menu-item-177, #menu-item-595').addClass('button_solid_color');
    });

    1) The arrows did not come back after changing the style from original to ascend. Any other ideas?

    2) The sub-menu's look very strange after making the main item solid using the script above. 'Contact' still has a normal sub menu, but 'Mijn VIP' for example has strange collapsing buttons on hover. Any idea how to fix this?

  •  8,455
    Tahir replied
    January 31, 2017 at 2:50pm

    Hey Again,

    Could you switch back to Original so i can have a look at why the arrows arent showing .

    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

    /* fix dropdown menu of solid buttons  */
#header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.button_solid_color a:hover {
    margin-right: 0px;
    margin-left: 0px;
}
#header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.button_solid_color >a:hover {
    margin-right: 10px;
    margin-left: 10px;
}

    Thanks

    ThemeNectar Support Team 

  •  2
    Yorick replied
    February 7, 2017 at 5:40pm

    Thank you for the great support, we are almost there! The dropdown menu items are now fixed with your custom css. 

    Only the icons remain, I switched back to original so I hope you can see the problem now. It is a bit more serious than i thought, the mobile menu icon is also gone.


  •  8,455
    Tahir replied
    February 7, 2017 at 5:48pm

    Hey Again,

    So the Easiest Method is to Enqueue the Salient Theme fontawesome file again using this code in the Child theme functions.php :

    wp_enqueue_style('font-awesome-salient', get_template_directory_uri() . '/css/font-awesome.min.css');

    add_action( 'wp_enqueue_scripts', 'salient_child_enqueue_styles');
function salient_child_enqueue_styles() {
   wp_enqueue_style('font-awesome-salient', get_template_directory_uri() . '/css/font-awesome.min.css');
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css', array('font-awesome'));
    if ( is_rtl() ) 
           wp_enqueue_style(  'salient-rtl',  get_template_directory_uri(). '/rtl.css', array(), '1', 'screen' );
}

    Best.

    ThemeNectar Support Team 

  •  2
    Yorick replied
    February 7, 2017 at 6:05pm

    The child functions.php already contains some code like this, do i replace this code or just paste underneath?

    add_action( 'wp_enqueue_scripts', 'salient_child_enqueue_styles');
    function salient_child_enqueue_styles() {
        
        wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css', array('font-awesome'));

        if ( is_rtl() )
               wp_enqueue_style(  'salient-rtl',  get_template_directory_uri(). '/rtl.css', array(), '1', 'screen' );
    }


  •  8,455
    Tahir replied
    February 7, 2017 at 6:14pm

    But it doesnt have this line : 

    wp_enqueue_style('font-awesome-salient', get_template_directory_uri() . '/css/font-awesome.min.css');

    Please see the code provided closely and make the changes .

    Be.st

    ThemeNectar Support Team 

  •  2
    Yorick replied
    February 7, 2017 at 6:36pm

    Works! Thank you :)