导读:建站技术建站技术在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导航菜单 —— 输出标题描述,建主要讲述你的,菜单,建站网站建设源码以及服务器配置搭建相关技术文章。转载请保留链接: http://www.tngdez.cn/article/web_34807.html
