您的浏览器需要启用 JavaScript 才能正常访问此网站。
萨龙网络
登录
首页-WordPress文章-WordPress-正文

WordPress 添加菜单项目描述

萨龙龙萨龙龙WordPress7年前001.53W
WordPress 能够在自定义菜单中存储每个菜单项的描述,默认情况下,这些描述不会显示在前端菜单中,需要为相应的菜单增加显示描述的功能。

一、显示菜单图像描述选项

默认情况下,WordPress 隐藏描述输入字段,在后台外观——菜单页面上,单击屏幕右上角『显示选项』选项卡,在『显示高级菜单属性』中确保勾选『图像描述』复选框。 WordPress 添加菜单项目描述 现在,对于菜单编辑器中的每个菜单项,都有一个图像描述的输入框。

二、显示描述

网上有很多教程解释如何使用自定义walker类来遍历菜单并自定义输出。但是,我真的希望不必重新创建整个类,只需要为每个菜单项添加描述。
function prefix_nav_description( $item_output, $item, $depth, $args ) {
    if ( !empty( $item->description ) ) {
        $item_output = str_replace( $args->link_after . '', '' . $item->description . '' . $args->link_after . '', $item_output );
    }
    return $item_output;
}
add_filter( 'walker_nav_menu_start_el', 'prefix_nav_description', 10, 4 );
我们将函数添加到walker_nav_menu_start_el过滤器中,此过滤器将四个参数传递给我们的函数。
  • $item_output :string——菜单项的开始输出HTML标签
  • $item:object——菜单项数据对象
  • $depth:int——菜单项的深度,用于填充
  • $args:array——wp_nav_menu() 数组的参数
首先,我们检查当前菜单项是否存在描述,如果有,我们使用str_replace()函数将描述插入到链接中,将描述放在主链接文本之后。 更改描述放置 现在假设我们要将描述放在主链接文本之前而不是之后。为此,我们需要修改对str_replace()函数的调用。之前,这是我们要修改的字符串:
$args->link_after . ''
我们使用str_replace()来替换这个文本字符串:
'' . $item->description . '' . $args->link_after . ''
要将描述放在主链接文本之前,我们需要替换字符串的这一部分:
'">' . $args->link_before . $item->title
我们要用以下内容替换它的内容:
$args->link_before . '' . $item->description . '' . $item->title
所以我们的新函数代码如下(只有$item_output行已更改):
function prefix_nav_description( $item_output, $item, $depth, $args ) {
    if ( !empty( $item->description ) ) {
        $item_output = str_replace( '">' . $args->link_before . $item->title, '">' . $args->link_before . '' . $item->description . '' . $item->title, $item_output );
    }
    return $item_output;
}
add_filter( 'walker_nav_menu_start_el', 'prefix_nav_description', 10, 4 );
原文地址:https://themefoundation.com/menu-item-descriptions/
标签:
本文原创,作者:萨龙龙,其版权均为萨龙网络所有。
如需转载,请注明出处:https://salongweb.com/wordpress-menu-item-descriptions.html
萨龙龙

萨龙龙

侠客
一个平平常常的人,热爱生活、旅行和摄影,骑行去过西藏,一直计划再去。14年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1422.44M457.21W4.42W
加载中…
分享:
使用 wp_add_inline_script 函数向 WordPress 站点输出脚本
使用 wp_add_inline_script 函数向 WordPress 站点输出脚本上一篇
让 WordPress 菜单图像描述支持 HTML 标签下一篇
让 WordPress 菜单图像描述支持 HTML 标签
相关文章
总数:115

WordPress多站点社区动态中获取自定义文章类型更新

萨龙网络使用Buddypress社区已经很长一段时间,在社区首页动态中可能获取整个网站的最新文章、用户注册,用户动态内容,而自定义文章类型的发布…
萨龙龙萨龙龙Buddypress, WordPress10年前001.29W0

WordPress添加标签相关文章简码

自从了解到Wordpress MU多站点,就开始一步一步的向多站点发展,也将萨龙网络所有站点都安装在Wordpress MU多站点中。在使用多站…
萨龙龙萨龙龙WordPress10年前001.32W0

移除 WooCommerce 商城插件编辑产品中的产品数据相关 tabs

WooCommerce 插件默认为编辑产品页面提供了产品数据 TABS,默认包括:常规、库存、配送、联锁产品、属性、高级等模块,功能强大而实用。…
萨龙龙萨龙龙WooCommerce8年前001.44W0

在WooCommerce中添加“立即购买”按钮直接跳转到结算页面

MNews 主题集成了 WooCommerce 商城插件,有些用户要求增加一个『立即购买』按钮,这篇文章介绍下如何在WooCommerce中添加…
萨龙龙萨龙龙WooCommerce8年前003.26W0

使用WordPress MU一个程序创建多站点网络介绍与安装教程

经常折腾wp的人肯定不止一个博客,主题高产的WPER那就更不用说,所以我们不想重复地安装wordpress,通过WordPress MU只需要安…
萨龙龙萨龙龙WordPress11年前002.33W2

WooCommerce 3 更新后特色产品的获取方法

WooCommerce 已经是 WordPress 平台最好最强大的在线商城插件,已经被 WordPress 收购,更新速度比较频繁,功能更加完…
萨龙龙萨龙龙WooCommerce8年前001.28W0

CSS3 background-attachment:fixed实现滚动视差效果

一直都想设计一个有滚动视差效果的主题,而网上所有的介绍和有视差效果的主题都是使用jQuery来实现,而且由于视差背景图是一张满屏的大小,所以一直…
萨龙龙萨龙龙WordPress11年前001.61W0

WordPress获取自定义文章类型分类下的文章并循环

Wordpress获取分类文章的函数有query_posts和WP_Query,两个函数的功能都很强大,推荐使用WP_Query函数来查询文章。…
萨龙龙萨龙龙WordPress10年前001.69W0

WordPress 限制上传媒体的文件类型

MNews 和 LensNews 主题都有前台投稿的功能,用户可以上传图片等文件,管理员是不希望用户上传任意的媒体文件,这时我们可以对用户上传的…
萨龙龙萨龙龙WordPress8年前001.36W0

如何把WordPress数据迁移至WordPress MU

前面我们介绍了如果安装WordPress MU,安装完成后我们就需要把每个独立站点的数据转移到MU中,在MU中最原始的站点数据是不需要改动,只需…
萨龙龙萨龙龙WordPress11年前001.51W0

WordPress 一键数据库初始化重置插件:WordPress Reset

在开发 WordPress 主题中,需要 N 多次测试,这样就需要多次重装测试网站,这样相当的麻烦。今天了解到一款数据库初始化插件:WordPr…
萨龙龙萨龙龙WordPress7年前002.01W0

萨龙网络站点群所有网站使用https访问

HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer),是以安全为目标的…
萨龙龙萨龙龙WordPress10年前001.54W0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容