在自定義主題WordPress上添加下拉菜單

Question

我正在嘗試為正在開發的主題創建下拉菜單，但是子菜單項顯示在父菜單項旁邊。

我將其保存為子菜單項

這就是我們的程序應該在我們周圍的樣子，現在簡直是混亂

這就是我在functions.php中導航的內容

function register_my_menus() {
  register_nav_menus(
    array(
      'header-menu' => __( 'Header Menu' ),
      'extra-menu' => __( 'Extra Menu' )
    )
  );
}

add_action( 'init', 'register_my_menus' );

   $defaults = array(
    'default-image'          => '',
    'width'                  => 0,
    'height'                 => 0,
    'flex-height'            => false,
    'flex-width'             => false,
    'uploads'                => false,
    'random-default'         => false,
    'header-text'            => true,
    'default-text-color'     => '',
    'wp-head-callback'       => '',
    'admin-head-callback'    => '',
    'admin-preview-callback' => '',
);
add_theme_support( 'custom-header', $defaults );

並在我的header.php中

<div id="menu">
    <ul>
        <li id="access"><?php wp_nav_menu( array( 'sort_column' => 'menu_order', 'container_class' => 'menu-header' ) ); ?></li>
    </ul>
</div>

我似乎無法在網上找到任何東西。 任何幫助，將不勝感激！

Answer 1

您必須為菜單創建類，並且必須將這些類應用於菜單。 您可以使用Walker將幾個條件類添加到菜單中。

有關更多詳細信息，請參閱

https://developer.wordpress.org/reference/functions/wp_nav_menu/

wp_nav_menu( array( 
  'sort_column' => 'menu_order', 
  'container_class' => 'menu-header',
  'menu_class' => 'your_class' //you can add your class here,
  'container' => 'div',
  'menu' => 'main-nav',
  'theme_location'    => 'my-header-menu', // Select the menu name registered in functions.php
  'walker'            => "", // Instance of a custom walker class to add conditional classes into your nav menu
));

Answer 2

您需要向菜單添加不同的類。 並將適當的CSS應用於position（ left: (n)px; top: (n)px; ）這些類。

wp_nav_menu( array( 
  'sort_column' => 'menu_order', 
  'container_class' => 'menu-header',
  'menu_class' => 'custom_menu' //add class,
  'container' => 'div',
  'menu' => 'main-nav',
));

希望它能對您有所幫助:)

Answer 3

將此代碼添加到functions.php文件中

add_action('wp_enqueue_scripts', 'buena_child_scripts');

function register_flatlearn_menu(){
  //register menu
  register_nav_menus(
    array(
      'primary-menu' => __('Primary Menu'),
      'footer-menu' => __('Footer Menu')
      )
    );
  }
  //attach with action hook
  add_action("init","register_flatlearn_menu");

在此代碼之后，將以下代碼添加到header.php文件中，如下所示：

<nav>
  <?php
     wp_nav_menu(array(
       'sort_column' => 'menu_order',
       'menu-id' =>'primary-menu',
       'depth' => 0,
       'container' =>'false' ,
       'menu_class' => 'nav topnav',
     ));
  ?>
</nav>