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

WordPress 添加菜单项目描述

萨龙龙萨龙龙WordPress7年前001.55W
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.46M457.22W4.42W
加载中…
分享:
使用 wp_add_inline_script 函数向 WordPress 站点输出脚本
使用 wp_add_inline_script 函数向 WordPress 站点输出脚本上一篇
让 WordPress 菜单图像描述支持 HTML 标签下一篇
让 WordPress 菜单图像描述支持 HTML 标签
相关文章
总数:115

WordPress 文章查询类 WP_Query 如何获取序列化数组中的文章

还是在开发导航类主题 Slhao 的时候遇到的问题,主题使用 Codestar Framework 专业版选项框架,文章的 Metabox 选项…
萨龙龙萨龙龙WordPress7年前001.33W0

WordPress按自定义文章类型进行搜索

一般的Wordpress主题中都有多种自定义文章类型,除了了默认的文章还会有作品、商品等自定义类型的文章,而WordPress默认只能搜索到文章…
萨龙龙萨龙龙WordPress10年前001.38W0

WordPress 主题 MNews Pro 5.2 投稿新增可插入音视频功能

MNews Pro 主题已经更新到5.2版本,功能已经很完善,且实用,在文章投稿编辑器有用户提出不能上传视频或者插入视频简码不方便的问题。 …
萨龙龙萨龙龙WordPress4年前002.72W0

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

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

WordPress强大好用的分页插件WP-PageNavi使用

相信使用Wordpress的朋友都对WP-PageNavi分页插件不陌生,很多博客对它也有很多介绍,之前也使用过代码来实现分页,但不够人性化,使…
萨龙龙萨龙龙WordPress10年前002.64W0

wordpress自定义域函数get_post_custom_values多个值循环

自定义域在Wordpress中有着相当重的份量,很多功能都可以在其中实现,最近有朋友要萨龙龙添加两个功能,一是缩略图使用自定义域来获取(支持外链…
萨龙龙萨龙龙WordPress10年前001.18W0

修改Woocommerce商品固定链接其它自定义文章类型适用

在更新Concise主题时集成了前端用户中心和商城插件,发现插件中为商城产品文章设置好了固定链接,所以把萨龙网络的作品集与商城的两种自定义类型的…
萨龙龙萨龙龙WooCommerce11年前001.53W0

WordPress为所有文章自动添加自定义字段

Sixianqiu主题是专为诗歌设计开发的主题,有一些朋友也需要这样的多形式博客主题,就整理出来了。一开始所有的文章内容都是居中显示,这样对于其…
萨龙龙萨龙龙WooCommerce9年前001.84W0

Nuxt 3 项目中集成 AI API 实现智能内容生成与多语言翻译

随着大语言模型(LLM)技术的飞速发展,越来越多的 Web 应用开始集成 AI 能力——从智能客服、内容摘要到自动翻译,AI 正在重塑前端开发的…
萨龙龙萨龙龙WordPress2个月前002.81K0

Woocommerce+Buddypress+Bbpress商城社区论坛头像本地化

萨龙网络Purity主题是集成了Woocommerce+Buddypress+Bbpress商城社区论坛,因为www.gravatar.com头…
萨龙龙萨龙龙Bbpress, Buddypress, WooCommerce, WordPress11年前002.12W0

WooCommerce 注册表单添加本站名称为字段的验证方式

萨龙网络使用的 Youji 原创企业主题注册登录都是使用 WooCommerce 商城插件自带的表单,使用简单方便。最近苦于国外机器人注册多,且…
萨龙龙萨龙龙WooCommerce7年前001.56W0

WordPress 媒体库支持 SVG 图标的上传与预览

WordPress 默认支持多种图片格式包括 .jpg,.jpeg,.png,和.gif,出于安全考虑不能上传可缩放矢量图形(SVG)。SVG是…
萨龙龙萨龙龙WordPress7年前001.35W0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容