在wordpress模板中添加自定义导航菜单

Question

我正在尝试在模板页面内的 WordPress 网站上添加自定义菜单。我已经使用此代码成功注册了新菜单

      function register_my_menu() {

      register_nav_menu('new-menu',__( 'New Menu' ));
    }

     add_action( 'init', 'register_my_menu' );

现在我已经在 page.php 中添加了这个菜单，并成功地在我的 wordpress 页面上获取了菜单项

 < ? php wp_nav_menu( array( 'theme_location' => 'new-menu' ) ); ?>

问题是我看到的菜单项是这样垂直的 http://prntscr.com/dt6300。如何设置自定义菜单的样式？如果有人可以给个提示！

Answer 1

这取决于你想做什么样的菜单。您可以检查浏览器上的代码以查看生成的 HTML 的 classes 并为每个元素创建相对的 CSS。您可以将 container 参数传递给 wp_nav_menu:

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

'container'

(string) Whether to wrap the ul, and what to wrap it with. Default 'div'.

和以下参数为元素提供 id 和 class：

'menu_class'

(string) CSS class to use for the ul element which forms the menu. Default 'menu'.

'menu_id' (string)

The ID that is applied to the ul element which forms the menu. Default is the menu slug, incremented.

'container_class' (string)

Class that is applied to the container. Default 'menu-{menu slug}-container'.

'container_id' (string)

The ID that is applied to the container.

您还可以在这里看到： https://codex.wordpress.org/Creating_Horizontal_Menus

<?php wp_nav_menu( array( 'theme_location' => 'new-menu', 'menu_class' => 'mymenuclass', 'menu_id' => 'mymenuid', 'container_class' => 'mycontainerclass' ) ); ?>

在wordpress模板中添加自定义导航菜单

Add custom navigation menu in wordpress template

css

php

wordpress

wordpress-theming

custom-wordpress-pages