要在 WordPress 裡面自訂選單，可以透過內建的 wp_nav_menu() 函式。

首先我們先在管理介面的外觀 -> 選單那邊建立一個新的選單：

選單命名

 

選單內容

 

儲存之後，接著在 WP 的樣板裡想要顯示的地方呼叫 wp_nav_menu() 就會出現選單了。

WP 會自動連 HTML 都產生，如果有要調整的話可以丟參數進去 function。

 

在呼叫函式的時候，WP 是設計為讓開發者丟陣列進去修改內容：

wp_nav_menu( array $args = array() )

可以丟的內容包含(以下為 WP 的說明)：

$args

(array) (Optional) Array of nav menu arguments.

  • 'menu'
    (int|string|WP_Term) Desired menu. Accepts a menu ID, slug, name, or object.
  • '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'
    (string) Whether to wrap the ul, and what to wrap it with. Default 'div'.
  • '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.
  • 'container_aria_label'
    (string) The aria-label attribute that is applied to the container when it's a nav element.
  • 'fallback_cb'
    (callable|false) If the menu doesn't exist, a callback function will fire. Default is 'wp_page_menu'. Set to false for no fallback.
  • 'before'
    (string) Text before the link markup.
  • 'after'
    (string) Text after the link markup.
  • 'link_before'
    (string) Text before the link text.
  • 'link_after'
    (string) Text after the link text.
  • 'echo'
    (bool) Whether to echo the menu or return it. Default true.
  • 'depth'
    (int) How many levels of the hierarchy are to be included. 0 means all. Default 0. Default 0.
  • 'walker'
    (object) Instance of a custom walker class.
  • 'theme_location'
    (string) Theme location to be used. Must be registered with register_nav_menu() in order to be selectable by the user.
  • 'items_wrap'
    (string) How the list items should be wrapped. Uses printf() format with numbered placeholders. Default is a ul with an id and class.
  • 'item_spacing'
    (string) Whether to preserve whitespace within the menu's HTML. Accepts 'preserve' or 'discard'. Default 'preserve'.

 

 

所以假設我建立了另一個選單，名稱設定為 second，那我要在頁面裡面把他叫出來，就可以寫成這樣：

wp_nav_menu(array(
	'menu'=>'second'
));

 

這樣就可以指定要呼叫的選單了。

又或者要修改選單的 class name，就可以丟 menu_class 的新的值進去，依此類推就可以修改各個部分的 html 內容了。

參考：
wp_nav_menu()