导读:建站技术建站技术在WordPress 3.0中增加了自定义菜单功能，如果你在WordPress后台（外观>菜单）创建一个菜单，你可以在主题中使用wp_nav_menu()函数来自助建站技术建站技术员。
在WordPress 3.0中增加了自定义菜单功能，如果你在WordPress后台（外观>菜单）创建一个菜单，你可以在主题中使用wp_nav_menu()函数来显示这些菜单。但是像图中这种带描述的导航菜单还无法简单实现，本文将教你改变WordPress默认的菜单输出结构，打造个性的导航菜单。
首先我们先看下默认的输出结构：
<ul id="menu-main">
<li><a href="#">首页</a></li>
<li><a href="#">关于</a></li>
</ul>
默认的结构根本不可能输出我们想要的效果，所以我们需要改变输出的结果：
<ul id="menu-main">
<li><a href="#"><strong>首页</strong><span>Home</span></a></li>
<li><a href="#"><strong>关于</strong><span>About</span></a></li>
</ul>
准备工作
我们要做的第一件事就是到菜单页面，你会发现每个菜单项都有一个“标题属性”，了解网页都知道这是用来显示鼠标移到链接上后的提示性文字，首先把你希望显示的文字先填上~
WordPress使用一个特殊的“Walker”类来遍历数据记录并显示出来。幸运的是，我们可以很轻松的创建属于我们自己的“Walker”类从而改变菜单的输出结构。
打开你主题文件中的function.php文件，并添加如下代码：
class description_walker 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;
$classes[] = 'menu-item-' . $item->ID;
$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
$class_names = ' class="' . esc_attr( $class_names ) . '"';
$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
$id = strlen( $id ) ? ' id="' . esc_attr( $id ) . '"' : '';
关键词标签: 建站 你的 菜单
声明: 本文由我的SEOUC技术文章主页发布于:2023-07-23 ，文章改进你的WordPress导航菜单 —— 输出标题描述,建主要讲述你的,菜单,建站网站建设源码以及服务器配置搭建相关技术文章。转载请保留链接: https://www.seouc.com/article/web_34807.html
