萨龙网络
登录
首页-WordPress文章-WordPress-正文

WordPress函数wp_nav_menu_items向菜单列表中添加搜索内容

萨龙龙萨龙龙
WordPress
10年前
0
0
1.01W
Wordpress函数wp_nav_menu_items向菜单列表中添加搜索内容Wordpress的菜单都是通过后台菜单来添加设置,很多时候需要添加一些功能到菜单,比如搜索,或者购物车,这时我们就可以使用wp_nav_menu_items函数向菜单列表中添加一些内容来实现。 最近在更新Taji主题,设计之初没有把搜索添加进去,一直是使用ubermenu超级菜单来实现搜索功能,现在更新后准备出售,所以在默认的导航菜单中再把搜索功能添加进去,通过以下代码可以在导航菜单列表末尾添加一个搜索图标,鼠标经过或点击再显示搜索表单。

添加以下代码到主题的functions.php中

  1. function add_search_to_wp_menu ( $items$args ) {
  2.     if( 'header-menu' === $args -> theme_location ) {
  3.         $items .= '<li class="menu-item menu-item-search">';
  4.         $items .= '<a class="search_trigger" href="#"><i class="icon-search-1"></i></a>
  5.         <section class="salong_search searchHidden"><form method="get" class="menu-search-form" action="' . get_bloginfo('home') . '/"><input class="text_input" type="text" placeholder="'.__("输入关键字…",'salong').'" name="s" id="s" /><input type="submit" class="search_btn" id="searchsubmit" value="'.__("搜索",'salong').'" /></form></section>';
  6.         $items .= '</li>';
  7.     }
  8.     return $items;
  9. }
  10. add_filter('wp_nav_menu_items','add_search_to_wp_menu',10,2);
header-menu为导航菜单的名称,比如注册菜单的代码为:
  1. register_nav_menu( 'header-menu', __( '导航菜单', 'salong' ) );
所以不要添加“导航菜单” [successbox]$items中可添加任意的代码,所以通过文章中第一段代码可以向菜单列表中添加任意可行的功能。[/successbox][scbutton link="https://taji.me" target="blank" variation="red"]演示地址[/scbutton]
标签:
本文原创,作者:萨龙龙,其版权均为萨龙网络所有。
如需转载,请注明出处:https://salongweb.com/wp-nav-menu-items.html
萨龙龙

萨龙龙

侠客
一个平平常常的人,热爱生活、旅行和摄影,骑行去过西藏,一直计划再去。14年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1342.26M456.70W3.85W
分享:
WoSign沃通SSL证书免费申请与AMH云主机面板安装设置
WoSign沃通SSL证书免费申请与AMH云主机面板安装设置上一篇
WordPress MU多站点从子域名转子目录下一篇
WordPress MU多站点从子域名转子目录
相关文章
总数:107

解决网站嵌入优酷视频堆叠顺序的问题

很多网站都会插入优酷或其它网站的在线视频到自己的网站中,默认情况下优酷视频的堆叠顺序并不受CSS样式z-index属性的影响,在视频页面有滚动、…
萨龙龙萨龙龙
WordPress
9年前
0
0
1.30W
0

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

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

WordPress 主题 Slearn Pro 课程插件之编辑文章时创建和选择课时

在WordPress+Vue.js主题SlearnPro发布2.0重写版本后,用户反馈编辑课程选择课时时不够友好,课时很多时选择就相…
萨龙龙萨龙龙
WordPress
3年前
0
0
2.50W
0

WordPress强大的开源后台框架Redux Framework介绍与使用

开发一个WP主题有了前端页面设计的美观与布局外,后台选项也是相当重要的一个组成部分,好的后台框架在使用主题时方便快捷的设置各个功能,也让主题开发…
萨龙龙萨龙龙
WordPress
10年前
0
0
2.34W
0

WordPress 获取用户 ID 的8种方法

在WordPress主题的开发过程中,获取用户ID的频率是很高的,可在WordPress中查看用户信息,也可以通过代码直接获取。 …
萨龙龙萨龙龙
WordPress
4年前
0
0
4.95W
0

自定义WooCommerce产品文章hook顺序

最近在做一款企业产品展示的商城网站,设计WooCommerce产品文章的布局与默认的布局有很大的不同,所以其中的一些模块都需要重新调整。WooC…
萨龙龙萨龙龙
WooCommerce
9年前
0
0
1.45W
0

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

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

WordPress桌面客户端无需浏览器管理多个站点及JetPack安装使用

WordPress推出已经十多年了,越来越多的个人与公司都是在使用其开发自己的网站,全球的开发者也都在为其提供程序。WordPress移动客户端…
萨龙龙萨龙龙
WordPress
10年前
0
0
1.72W
0

WordPress向菜单中添加分类缩略图

同样是在开发吃货主题Chihuo,导航菜单中的二级菜单需要显示省份的小地图,也就是分类菜单中显示自定义的字段,我们可通过以下代码来实现这个功能。…
萨龙龙萨龙龙
WordPress
9年前
0
0
1.09W
0

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

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

WordPress批量替换自定义域名称

WordPress自定义的强大不言而喻,很多主题都在使用,也为其创建了可视化的选项面板,用户使用都相当的直观、方便。萨龙网络新开发的LensNe…
萨龙龙萨龙龙
WordPress
9年前
0
0
9.33K
0

为woocommerce商城添加图片延迟(lazyload)加载功能

wordpress图片延迟加载已经不是稀奇的功能,网上有很多类似的文章,添加相当简单方便,woocommerce缩略图图片延迟加载也很方便的可以…
萨龙龙萨龙龙
WooCommerce
10年前
0
0
1.33W
0
评论表单游客 您好,欢迎参与讨论。
请输入昵称
请输入邮箱
请输入网址
0 / 0
评论列表
总数:0
萨龙网络
没有相关内容