zblogphp的导航栏如何添加无链接的一级菜单?

花开花谢,人来又走,夕阳西下,人去楼空,早已物是人非矣。也许,这就是结局,可我不曾想过结局是这样;也许,这就是人生的意义,可我不曾想竟是生离死别。

默认情况下 Z-BlogPHP 的导航栏菜单都是带有链接地址的,那么我们如何添加无链接的一级菜单呢?首先我们来看看正常的 zblogphp 的导航菜单代码。只需要登录 Z-BlogPHP 站点后台 >> 模块管理 >> 导航栏,在正文中即可看到导航栏菜单的代码,具体如下:

<li id="nvabar-item-index"><a rel="nofollow noopener noreferrer" href="http://localhost/"><i class="fa fa-home" aria-hidden="true"></i> 首页</a></li>
<li><a rel="nofollow noopener noreferrer" href="http://localhost/category-1.html"><i class="fa-fire fa"></i> boke112 导航</a><ul class="sub-menu"> <li id="navbar-page-2"><a rel="nofollow noopener noreferrer" href="http://localhost/2.html"><i class="fa fa-user" aria-hidden="true"></i> 个人档案</a></li></ul></li>

以上菜单代码是含有个性化图标,仅做参考。

比如我们将上述代码中带有二级菜单的一级菜单“boke112 导航”改为无链接,那么只需要将它所对应的 rel="nofollow noopener noreferrer" href="http://localhost/category-1.html"去掉即可。修改之后的代码如下:

<li id="nvabar-item-index"><a rel="nofollow noopener noreferrer" href="http://localhost/"><i class="fa fa-home" aria-hidden="true"></i> 首页</a></li>
<li><a><i class="fa-fire fa"></i> boke112 导航</a><ul class="sub-menu"> <li id="navbar-page-2"><a rel="nofollow noopener noreferrer" href="http://localhost/2.html"><i class="fa fa-user" aria-hidden="true"></i> 个人档案</a></li></ul></li>

效果如下:

如果直接去掉一级菜单“boke112 导航”的 A 标签,那么就不会上图红色箭头所对应的“倒三角”效果,这个标识说明是该菜单带有二级菜单。

PS:以上代码及效果是以 zblogPHP 版本的 Blogs 主题为例进行说明,其他主题的一级和二级菜单效果及样式请自行折腾。

拓展阅读

  • WordPress 如何添加无链接的导航(一级)菜单

以上就是zblogphp的导航栏如何添加无链接的一级菜单?。永远比对手快一步。更多关于zblogphp的导航栏如何添加无链接的一级菜单?请关注haodaima.com其它相关文章!

您可能有感兴趣的文章
ZBlogPHP网站如何更换域名?附详细步骤图文好代码教程

ZBlogPHP文章和页面如何添加canonical标签?

ZBlogPHP免费主题Blogs如何隐藏后台登录地址?

ZBlogPHP的浏览量可以修改吗?怎么修改默认浏览量?

ZBlogPHP免费响应式主题Blogs如何修改title结构?