Title: Yuriy Stepanov's Replies | WordPress.org

---

# Yuriy Stepanov

  [  ](https://wordpress.org/support/users/stur/)

 *   [Profile](https://wordpress.org/support/users/stur/)
 *   [Topics Started](https://wordpress.org/support/users/stur/topics/)
 *   [Replies Created](https://wordpress.org/support/users/stur/replies/)
 *   [Reviews Written](https://wordpress.org/support/users/stur/reviews/)
 *   [Topics Replied To](https://wordpress.org/support/users/stur/replied-to/)
 *   [Engagements](https://wordpress.org/support/users/stur/engagements/)
 *   [Favorites](https://wordpress.org/support/users/stur/favorites/)

 Search replies:

## Forum Replies Created

Viewing 4 replies - 1 through 4 (of 4 total)

 *   Forum: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
   
   In reply to: [wp_nav_menu: horizontal menu, with children underneath](https://wordpress.org/support/topic/wp_nav_menu-horizontal-menu-with-children-underneath/)
 *  [Yuriy Stepanov](https://wordpress.org/support/users/stur/)
 * (@stur)
 * [14 years, 6 months ago](https://wordpress.org/support/topic/wp_nav_menu-horizontal-menu-with-children-underneath/#post-1963781)
 * You should specify the horizontal orientation.
    I give a link to the full code
   and an example of my theme. [http://www.wp.od.ua/en/?p=65](http://www.wp.od.ua/en/?p=65)
   [http://www.wp.od.ua/en/?p=49](http://www.wp.od.ua/en/?p=49)
 *   Forum: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
   
   In reply to: [wp_nav_menu dropdown walker](https://wordpress.org/support/topic/wp_nav_menu-dropdown-walker/)
 *  [Yuriy Stepanov](https://wordpress.org/support/users/stur/)
 * (@stur)
 * [14 years, 10 months ago](https://wordpress.org/support/topic/wp_nav_menu-dropdown-walker/#post-1826732)
 * You can follow any responses to simplify css code dropdovn menu.
    1) Add a class**
   parent** for items that have a submenu 2) add **depth** class (depth0 , depth1,
   depth2 …)
 * add to function.php your theme
 *     ```
       class DD_Wolker_Menu extends Walker_Nav_Menu {
       	function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ){
       	    $GLOBALS['dd_children'] = ( isset($children_elements[$element->ID]) )? 1:0;
               $GLOBALS['dd_depth'] = (int) $depth;
               parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
           }
       }
       add_filter('nav_menu_css_class','add_parent_css',10,2);
       function  add_parent_css($classes, $item){
            global  $dd_depth, $dd_children;
            $classes[] = 'depth'.$dd_depth;
            if($dd_children)
                $classes[] = 'parent';
           return $classes;
       }
       ```
   
 * now in header.php
 *     ```
       wp_nav_menu( array( 'container_class' => '','container' => '',  'menu' => 'header-menu', 'walker'=> new DD_Wolker_Menu ) );
       ```
   
 * **header-menu** replaced by the name of your menu
 * CSS simplified code may be the
 *     ```
       #menu-header-menu{
           margin: 0;
           padding: 0;
       }
       #menu-header-menu  ul{
   
       }
   
       #menu-header-menu> li{
           display: inline;
           margin-left: 1.618em;
       }
       #menu-header-menu  li{
           list-style: none;
       }
       #menu-header-menu  li a{
           text-decoration: none;
           font-size: 	1em;
           font-family:	'Lato',Helvetica,Arial,sans-serif ;
           letter-spacing:	1px;
       }
       #menu-header-menu li.parent::after{
           content:'+';
       }
   
       #menu-header-menu  .sub-menu {
          display: none;
          position: absolute;
          background-color: #fff;
       }
   
       #menu-header-menu  li:hover>.sub-menu{
           display: inline;
           width: auto;
           height: auto;
           border: solid 1px #BBBBBB;
           z-index: +1;
       }
       ```
   
 * #menu-header-menu – id the main UL list
 *   Forum: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
   
   In reply to: [wp_nav_menu: horizontal menu, with children underneath](https://wordpress.org/support/topic/wp_nav_menu-horizontal-menu-with-children-underneath/)
 *  [Yuriy Stepanov](https://wordpress.org/support/users/stur/)
 * (@stur)
 * [14 years, 10 months ago](https://wordpress.org/support/topic/wp_nav_menu-horizontal-menu-with-children-underneath/#post-1963772)
 * You can follow any responses to simplify css code dropdovn menu.
    1) Add a class**
   parent** for items that have a submenu 2) add **depth** class (depth0 , depth1,
   depth2 …)
 * add to function.php your theme
 *     ```
       class DD_Wolker_Menu extends Walker_Nav_Menu {
       	function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ){
       	    $GLOBALS['dd_children'] = ( isset($children_elements[$element->ID]) )? 1:0;
               $GLOBALS['dd_depth'] = (int) $depth;
               parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
           }
       }
       add_filter('nav_menu_css_class','add_parent_css',10,2);
       function  add_parent_css($classes, $item){
            global  $dd_depth, $dd_children;
            $classes[] = 'depth'.$dd_depth;
            if($dd_children)
                $classes[] = 'parent';
           return $classes;
       }
       ```
   
 * now in header.php
 *     ```
       wp_nav_menu( array( 'container_class' => '','container' => '',  'menu' => 'header-menu', 'walker'=> new DD_Wolker_Menu ) );
       ```
   
 * **header-menu** replaced by the name of your menu
 * CSS simplified code may be the
    _[CSS moderated as per the [Forum Rules](http://codex.wordpress.org/Forum_Welcome#Posting_Code).
   Please just post a link to your site.]_
 * #menu-header-menu – id the main UL list
 *   Forum: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
   
   In reply to: [wp_nav_menu drop down issue](https://wordpress.org/support/topic/wp_nav_menu-drop-down-issue/)
 *  [Yuriy Stepanov](https://wordpress.org/support/users/stur/)
 * (@stur)
 * [14 years, 10 months ago](https://wordpress.org/support/topic/wp_nav_menu-drop-down-issue/#post-1941663)
 * You can follow any responses to simplify css code dropdovn menu.
    1) Add a class**
   parent** for items that have a submenu 2) add **depth** class (depth0 , depth1,
   depth2 …)
 * add to function.php your theme
 *     ```
       class DD_Wolker_Menu extends Walker_Nav_Menu {
       	function display_element( $element, &$children_elements, $max_depth, $depth=0, $args, &$output ){
       	    $GLOBALS['dd_children'] = ( isset($children_elements[$element->ID]) )? 1:0;
               $GLOBALS['dd_depth'] = (int) $depth;
               parent::display_element( $element, $children_elements, $max_depth, $depth, $args, $output );
           }
       }
       add_filter('nav_menu_css_class','add_parent_css',10,2);
       function  add_parent_css($classes, $item){
            global  $dd_depth, $dd_children;
            $classes[] = 'depth'.$dd_depth;
            if($dd_children)
                $classes[] = 'parent';
           return $classes;
       }
       ```
   
 * now in header.php
 *     ```
       wp_nav_menu( array( 'container_class' => '','container' => '',  'menu' => 'header-menu', 'walker'=> new DD_Wolker_Menu ) );
       ```
   
 * **header-menu** replaced by the name of your menu
 * CSS simplified code may be the
 *     ```
       #menu-header-menu{
           margin: 0;
           padding: 0;
       }
       #menu-header-menu  ul{
   
       }
   
       #menu-header-menu> li{
           display: inline;
           margin-left: 1.618em;
       }
       #menu-header-menu  li{
           list-style: none;
       }
       #menu-header-menu  li a{
           text-decoration: none;
           font-size: 	1em;
           font-family:	'Lato',Helvetica,Arial,sans-serif ;
           letter-spacing:	1px;
       }
       #menu-header-menu li.parent::after{
           content:'+';
       }
   
       #menu-header-menu  .sub-menu {
          display: none;
          position: absolute;
          background-color: #fff;
       }
   
       #menu-header-menu  li:hover>.sub-menu{
           display: inline;
           width: auto;
           height: auto;
           border: solid 1px #BBBBBB;
           z-index: +1;
       }
       ```
   
 * #menu-header-menu – id the main UL list

Viewing 4 replies - 1 through 4 (of 4 total)