效果图

教程开始

进入WordPress后台-外观-菜单页面

正常导航名称部分是纯文字的，因为这里也写了 支持HTML所以支持badge标签添加徽章，搭配子比自带的颜色 直接在class里面填写即可

列举几个常用的颜色名称

1. jb-red渐变红色背景

2.jb-yellow 渐变橙色背景

3.jb-blue 渐变蓝色背景

4.jb-green 渐变绿色背景

5.jb-purple 渐变紫色背景

6.jb-vip1 渐变金色背景

7.jb-vip2 渐变黑色背景

示例代码

网站建设<badge class="jb-yellow">NEW</badge>

第二种样式

示例代码

<!-- 按钮风格的菜单 -->
<span class="but jb-red">主题购买</span>
<span class="but c-blue">网站建设</span>
<span class="but c-yellow">科技资讯</span>
<span class="but b-purple radius">最新优惠</span><badge><i>VIP</i></badge>
<span class="but jb-vip2 radius">特惠资源</span><badge class="jb-red"><i class="fa fa-bolt"></i></badge>

原理相同 根据自己来写即可