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

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

萨龙龙萨龙龙WordPress10年前001.09W
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年从江西骑行来到大理,现栖居于洱海边,食人间烟火,过简单生活,做简约设计!
1422.41M457.20W4.42W
加载中…
分享:
WoSign沃通SSL证书免费申请与AMH云主机面板安装设置
WoSign沃通SSL证书免费申请与AMH云主机面板安装设置上一篇
WordPress MU多站点从子域名转子目录下一篇
WordPress MU多站点从子域名转子目录
相关文章
总数:115

禁用管理员通知『连接您的店铺到 WooCommerce.com 接受扩展更新和支持』

WooCommerce 后台对管理员的通知『连接您的店铺到 WooCommerce.com 接受扩展更新和支持』,是3.3.1版本后出来了,新的…
萨龙龙萨龙龙WooCommerce7年前001.22W0

使用 wp_add_inline_script 函数向 WordPress 站点输出脚本

前面我们介绍了wpadd_inline_style函数的使用,并为主题添加自定义样式切换功能,既然有函数可以向站点输出 css 样式,同时也可以…
萨龙龙萨龙龙WordPress7年前001.63W0

在 WordPress 主题中编辑器 WooCommerce 产品选项卡-tabs

WooCommerce 产品页面默认有3个选项卡:描述,其它信息和评论,对于很多 WordPress 主题或许不太适合,需要修改或者添加选项卡。…
萨龙龙萨龙龙WooCommerce, WordPress5年前003.30W0

WordPress Mega超级大菜单插件Ubermenu

Ubermenu是一个用户友好的、可高度定制响应式的Wordpress超级大菜单插件,工作原理与Wordpress 3菜单系统类似,强大到可创建…
萨龙龙萨龙龙WordPress11年前001.80W0

WordPress批量替换自定义域名称

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

WordPress 主题感染恶意代码function _check_active_widgets

萨龙龙开发主题这么久,第一次感染恶意代码,整个 WordPress 下的主题 functions.php 都被插入了一大段函数代码,百度一下也发…
萨龙龙萨龙龙WordPress8年前001.72W0

WordPress 主题禁用古滕堡编辑器和小工具

WordPress 4.9.8 版本就发布了古滕堡编辑器,很好用,添加文章也比经典编辑器方便很多。在 5.8 版本后又在小工具中增加了古滕堡编辑…
萨龙龙萨龙龙WordPress5年前001.60W0

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

wordpress图片延迟加载已经不是稀奇的功能,网上有很多类似的文章,添加相当简单方便,woocommerce缩略图图片延迟加载也很方便的可以…
萨龙龙萨龙龙WooCommerce11年前001.44W0

WordPress附件函数wp_get_attachment_metadata简码获取照片EXIF信息

自动获取照片的EXIF信息,很多大型的摄影论坛都有这个功能,对于摄影爱好者来说是一个很实用的功能。萨龙龙开发的Deephoto主题和Neatim…
萨龙龙萨龙龙WordPress10年前001.43W0

WordPress获取当前分类的顶级分类ID

在开发吃货主题Chihuo时,要对产品和文章进行筛选,在一级分类下显示所有一级分类和当前一级分类下的所有二级分类,在二级分类下,显示所有一级分类…
萨龙龙萨龙龙WordPress9年前001.91W0

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

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

翻译WordPress强大实用的Redux框架选项

强大、实用的Redux框架我们已经在WordPress强大的开源后台框架Redux Framework介绍与使用一文中介绍了,今天我们介绍下如何…
萨龙龙萨龙龙WordPress, 软件系统10年前001.46W0
评论表单游客 您好,欢迎参与讨论。
加载中…
评论列表
总数:0
萨龙网络
没有相关内容