Enable Menu Description

Hi Tom,

Yes there is a way to enable Menu Description but this may require a little HTML and CSS knowledge.

1. Go to Appearance> Menus and at the top right of the screen click on Screen Options and check the checkbox for Descriptions. Add description field will now appear when editing the menu items, so type in the descriptions such as Ana Sayfa and save the menu.

2. Then go to Appearance> Editor and go to edit the file Theme Functions (functions.php) and paste the following code at the bottom of the file:

class Menu_With_Description extends Walker_Nav_Menu {
    function start_el(&$output, $item, $depth, $args) {
        global $wp_query;
        $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
        $class_names = $value = '';
        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
        $class_names = ' class="' . esc_attr( $class_names ) . '"';
        $output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';
        $attributes = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) .'"' : '';
        $attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) .'"' : '';
        $attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) .'"' : '';
        $attributes .= ! empty( $item->url ) ? ' href="' . esc_attr( $item->url ) .'"' : '';
        $item_output = $args->before;
        $item_output .= '<a'. $attributes .'>';
        $item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
        $item_output .= '
<span class="sub">' . $item->description . '</span>';
        $item_output .= '</a>';
        $item_output .= $args->after;
        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }
}

Then save the file.

3. Finally go to edit the file menu.php which is listed after the files masthead.php and menu-empty.php (I said this because you might see 2 menu.php) and replace the code in the file with the following code:

<?php
/**
 * Part Name: Default Menu
 */
?>
<nav role="navigation" class="site-navigation main-navigation primary <?php if( siteorigin_setting('navigation_use_sticky_menu') ) echo 'use-sticky-menu' ?>">
	<div class="full-container">
		<?php if( siteorigin_setting('navigation_menu_search') ) : ?>
			<div id="search-icon">
				<div id="search-icon-icon"><div class="vantage-icon-search"></div></div>
				<form method="get" class="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>" role="search">
					<input type="text" class="field" name="s" value="<?php echo esc_attr( get_search_query() ); ?>" />
				</form>
			</div>
		<?php endif; ?>
		<?php $walker = new Menu_With_Description; ?>
		<?php wp_nav_menu( array( 'theme_location' => 'primary', 'link_before' => '<span class="icon"></span>', 'walker' => $walker ) ); ?>
	</div>
</nav><!-- .site-navigation .main-navigation -->

Please try and let me know.
Cheers!