WordPress 主题 ripro二级菜单添加数量统计和小圆点图标

效果图:

使用教程

1、文件修改路径 \ripro\functions.php 文件,在最下面添加以下代码:

//导航菜单增加文章统计
function wt_get_category_count($cat_ID) {
    $category = get_category($cat_ID);
    return $category->count;
}
function lanmitu_nav_items_num( $items,$args ) {
    if(isset($args->theme_location) && $args->theme_location == 'menu-1') {
        foreach ( $items as $key=>$item ) {
            if($item->object == 'category') {
                //$cat = get_category_by_slug($slug);
                $catID = isset($item->object_id) ? $item->object_id : false;
                if($catID && $item->post_parent!=0) {
                    $a=wt_get_category_count($catID);
                    $items[$key]->title.= '<span class="num">'.$a.'</span>';
                }
            }
        }
    }
    return $items;
}
add_filter( 'wp_nav_menu_objects', 'lanmitu_nav_items_num',10,2 );

全选代码复制

2、样式文件修改路径 \ripro\assets\css\diy.css 在最下面添加以下CSS样式:

/***二级导航前面小圆点***/
.lanse {
    box-sizing: border-box;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
	margin-left: 10px;
    margin-top: -6px;
    left: 0;
	border-color: #61e1b9;
	border: 3px solid #7a99f2;
}

.lvse {
    box-sizing: border-box;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
	margin-left: 10px;
    margin-top: -6px;
    left: 0;
	border-color: #61e1b9;
	border: 3px solid #70d7cf;
}
.huangse {
    box-sizing: border-box;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
	margin-left: 10px;
    margin-top: -6px;
    left: 0;
	border-color: #61e1b9;
	border: 3px solid #f5c745;
}
.hongse {
    box-sizing: border-box;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    margin-left: 10px;
    margin-top: -6px;
    left: 0;
    border-color: #61e1b9;
    border: 3px solid #f1787f;
}
/***二级导航前面小圆点结束***/

3、导航前面添加小圆点,在后台-菜单里设置,如下图:

<i class="hongse"></i> <i class="lanse"></i> <i class="huangse"></i> <i class="lvse"></i>

一共分为:hongse(红色) lanse(蓝色) huangse(黄色) lvse(绿色)四款样式,望大家按自己喜欢样式进行修改!

1. 本站所有资源来源于用户上传和网络,只做学习和交流使用,版权归原作者所有,请在下载后24小时之内自觉删除! 2. 盗版,破解有损他人权益和违法作为,请各位用户支持正版。 3. 由于未及时购买和付费发生的侵权行为,与本站无关。 4. 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 5. 资源如果失效或错链请联系管理员:66303299
21街博客 » WordPress 主题 ripro二级菜单添加数量统计和小圆点图标

发表评论

提供最优质的资源集合

立即查看 了解详情