子比主题新注册用户和会员用户展示小工具和代码

分享子比主题网站顶部展示用户的小工具和代码

小工具直接可以在后台外观→小工具里开启使用，代码直接覆盖到主题目录里两种方式

效果图：

第一种小工具：

在主题目录创建一个php文件例如：widgets-home-user.php

文件里面粘贴代码：

<?php
add_action('widgets_init', 'widget_register_home_authent_users');

function widget_register_home_authent_users()
{
    register_widget('widget_ui_authent_home_user_listsents');
}

class widget_ui_authent_home_user_listsents extends WP_Widget
{
    public function __construct()
    {
        $widget = array(
            'w_id'        => 'widget_ui_authent_home_user_listsents',
            'w_name'      => __('狗凯首页用户列表'),
            'classname'   => '',
            'description' => '首页显示网站用户列表，多种排序方式.',
        );
        parent::__construct($widget['w_id'], $widget['w_name'], $widget);
    }

    public function widget($args, $instance)
    {
        if (!zib_widget_is_show($instance)) {
            return;
        }

        extract($args);

        $defaults = array(
            'title'        => '',
            'mini_title'   => '',
            'more_but'     => '<i class="fa fa-angle-right fa-fw"></i>更多',
            'more_but_url' => '',
            'hide_box'     => false,
            'number'       => 8,
        );

        $instance = wp_parse_args((array) $instance, $defaults);
        $mini_title = $instance['mini_title'];

        if ($mini_title) {
            $mini_title = '<small class="ml10">' . $mini_title . '</small>';
        }

        $title = $instance['title'];
        $more_but = '';

        if ($instance['more_but'] && $instance['more_but_url']) {
            $more_but = '<div class="pull-right em09 mt3"><a href="' . $instance['more_but_url'] . '" class="muted-2-color">' . $instance['more_but'] . '</a></div>';
        }

        $mini_title .= $more_but;

        if ($title) {
            $title = '<div class="box-body notop"><div class="title-theme">' . $title . $mini_title . '</div></div>';
        }

        echo '<div class="theme-box">';
        echo $title;
echo '
    <style>
       /*新年悬挂开始*/

@keyframes lampLine-38cc6824 {
    0% {
        transform: rotate(10deg)
    }

    to {
        transform: rotate(-10deg)
    }
}

/** 用户排行榜在线状态 **/
            img.rela {
                position: absolute;
                left: 52px;
                z-index: 2;
                right: 50px;
                top: 58px;
                height: 25px;
                width: 25px;
            }

            .hot-top .right .top-ul li a {
                display: block;
                position: relative;
            }
  .rabbit-doll {
    width: 200px;
    height: 200px;
    display: inline-block;
    background: url(/wp-content/themes/zibllsucai/img/zibll-neizhi/widgets-home-user-php/tu02.webp) no-repeat 40%/100%;
    vertical-align: middle;
    position: absolute;
    left: 80%;
    top: 25px;
    z-index: 50;
    cursor: pointer;
    animation: lampLine-38cc6824 1.2s ease-in-out 0s infinite alternate;
    margin-left: -1px;
    transform-origin: 50% 0;
    pointer-events:none;
}  

          /*新年悬挂结束*/
    
    /**用户排行榜开始*/
         .hot-top    .left {
                float: left;
            }
.hot-top .right .top-ul li a h3 {

    white-space: nowrap;
}
       .hot-top      .right {
                float: right;
            }

            img {
                border: none;
            }

            .hot-top {
                width: 100%;
                background: var(--main-bg-color);
                margin-bottom: 25px;
                padding: 22px 20px;
                position: relative;
                height: 147px;
                overflow: hidden;
                border-radius: 10px 10px 10px 10px;
            }

            .hot-top .tg-ph {
                background-size: 100% 100%;
                position: absolute;
                right: 0;
                top: 0;
                z-index: 2;
                display: block;
                width: 60px;
                height: 60px;
            }

            .hot-top .left {
                height: 100%;
            }

            .hot-top .left a {
                display: block;
                width: 121px;
                height: 45px;
                line-height: 45px;
                background: #f6f6f6;
                text-align: center;
                font-size: 15px;
                color: #989898;
                margin-bottom: 13px;
                cursor: pointer;
                border-radius: 10px;
            }

            .hot-top .left a:last-child {
                margin-bottom: 0;
            }

            .hot-top .left .hover {
                background: #2b21fa;
                color: #FFF;
                position: relative;
            }

            .hot-top .left .hover:after {
                content: "";
                width: 0;
                height: 0;
                border-top: 7px solid transparent;
                border-bottom: 7px solid transparent;
                border-left: 10px solid #2b21fa;
                position: absolute;
                top: 15.5px;
                right: -10px;
                z-index: 1;
            }

            .hot-top .right-main {
                height: 100%;
                overflow-y: auto;
                margin-bottom: 30px;
            }

            .hot-top .right-main:last-child {
                margin-bottom: 0px;
            }

            .hot-top .right-overflow {
                transition: 0.4s all;
                transform: translateY(0);
            }

            .hot-top .right {
                float: left;
                width: calc( 100% - 147px);
                margin-left: 26px;
                height: 100%;
            }

            .hot-top .right .top-ul {
                height: 130px;
                overflow: hidden;
            }

            .hot-top .right .top-ul li {
                width: 78px;
                float: center;
                margin:0px 18px;
                display:inline-block;
            }

            .hot-top .right .top-ul li:nth-child(10n) {
                margin-right: 0;
            }

            .hot-top .right .top-ul li a {
                display: block;
            }

            .hot-top .right .top-ul li a .list-img {
                width: 100%;
                height: 78px;
                line-height: 78px;
                text-align: center;
                border-radius: 10px;
            }

            .hot-top .right .top-ul li a .list-img img {
                width: 100%;
            }

            .hot-top .right .top-ul li a .list-img img:hover {
                opacity: 0.8;
            }

            .hot-top .right .top-ul li a h3 {
                margin-top: 7px;
                font-size: 13px;
                line-height: 25px;
                height: 25px;
                overflow: hidden;
                width: 100%;
                text-align: center;
            }

            .new-position {
                height: 780px;
            }

            .new-position .left {
                height: 100%;
                width: calc( ( 100% - 13px ) * 0.36 );
            }

            .new-position .right {
                width: calc( ( 100% - 13px ) * 0.64 );
                height: 100%;
                background: #FFF;
                padding: 17px 28px;
            }

            .new-position .layui-carousel > [carousel-item] > * {
                background: #FFF;
            }

            .new-position #index-lb {
                height: 300px;
            }

            .new-position #index-lb div div img {
                width: 100%;
                min-height: 100%;
            }

            .new-position .index-login {
                background: #FFF;
                margin-top: 13px;
                height: calc( 767px - 300px);
                padding: 25px 33px;
                position: relative;
            }

            span.note {
                position: absolute;
                top: 10px;
                right: -50px;
                z-index: 1;
                width: 140px;
                height: 20px;
                background: #2c40a0;
                color: #fff;
                line-height: 20px;
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
                text-align: center;
                font-size: 12px;
            }
img.rela {
    position: absolute;
    left: 52px;
    z-index: 2;
    /* right: 50px; */
    top: 58px;
    height: 25px;
    width: 25px;
}

  /*头像呼吸光环和鼠标悬停旋转放大开始*/
    img.yuan {  
    border-radius: 50%;  
    animation: light 4s ease-in-out infinite;  
    transition: 2s;  
}  
  
img.yuan:hover {  
    transform: scale(1) rotate(720deg);  
}

        /*头像呼吸光环和鼠标悬停旋转放大结束*/
            /**用户排行榜结束*/
            </style>
        <div class="hot-top layui-clear">
            <span class="note">狗友们</span>
            <i class="tg-ph"></i>
            <div class="left">
                <a class="hover" id="lively_online" onmouseenter=lively_online()>新人名单</a>
                <a class="" id="contribution" onmouseenter=contribution()>会员用户</a>
            </div>
            <div class="right">
                <div class="right-overflow" id="yhturns" style="transform: translateY(0px);">
                    <div class="right-main">
                        <ul class="layui-clear top-ul">';
global $wpdb;
$lzj1=$wpdb->get_results("SELECT user_id FROM $wpdb->usermeta where meta_key='nickname' order by user_id desc limit 15");
$string1 = '';
foreach ($lzj1 as $result) {
    $args = $result->user_id;
    $string1 .= $args . ',';
}

$user_query = new WP_User_Query(array('include' =>  ($string1)));

if (!empty($user_query->results)) {
    foreach ($user_query->results as $user) {
        $avatar_img = zib_get_data_avatar($user->ID);
$user_home_url = zib_get_user_home_url($user->ID);

        $helf = zib_get_user_home_url($user->ID);
        $html = '';
        $html .= '<a href="' . $helf . '">' . $html . '</a>';
        echo '<li><div class="user-avatar">
        
        <a href="'.zib_get_user_home_url($user->id).'">  
        
        
        
        <span class="avatar-img avatar-lg">' . $avatar_img . $vip_icon. '</a><a href="' . zib_get_user_home_url($user->ID) . '"><h3>' . $user->display_name . ' </h3></a></span></div></li>';
    }
} else {
    echo '没有用户';
}
?>
                        </ul>
                    </div>
                    <div class="right-main">
                        <ul class="layui-clear top-ul">
<?php
global $wpdb;
$lzj2=$wpdb->get_results("SELECT user_id FROM $wpdb->usermeta where meta_key='vip_level' and meta_value='1' or meta_key='vip_level'  and meta_value='2' order by user_id desc limit 15");
$string2 = '';
foreach ($lzj2 as $result) {
    $args = $result->user_id;
    $string2 .= $args . ',';
}

$user_query = new WP_User_Query(array('include' =>  ($string2)));

if (!empty($user_query->results)) {
    foreach ($user_query->results as $user) {
        $avatar_img = zib_get_data_avatar($user->ID);
        
        $user_home_url = zib_get_user_home_url($user->ID);
        $html = '';
        $helf = zib_get_user_home_url($user->ID);
        $vip_icon   = '';
        $vip_icon = zib_get_avatar_badge($user->ID);
        $html = '<a href="' . $helf . '">' . $html . '</a>';
        echo '<li><div class="user-avatar">
        <a href="'.zib_get_user_home_url($user->id).'">  
        <span class="avatar-img avatar-lg">' . $avatar_img . $vip_icon . '<a href="' . zib_get_user_home_url($user->ID) . '"><h3>' . $user->display_name . ' </h3></a></span></div></li>';
    }
    

    
} else {
    echo '没有用户';
}
?>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
<script type="text/javascript">
    function lively_online() {
        document.getElementById('lively_online').className = 'hover';
        document.getElementById('contribution').className = ' ';
        document.getElementById('yhturns').style = 'transform: translateY(0px);';
    }
    function contribution() {
        document.getElementById('lively_online').className = ' ';
        document.getElementById('contribution').className = 'hover';
        document.getElementById('yhturns').style = 'transform: translateY(-160px);';
    }
</script>
<?php
        echo '</div>';
    }

    public function form($instance)
    {
        $defaults = array(
            'title'        => '',
            'mini_title'   => '',
            'more_but'     => '<i class="fa fa-angle-right fa-fw"></i>更多',
            'more_but_url' => '',
            'number'       => 8,
            'hide_box'     => '',
        );

        $instance = wp_parse_args((array) $instance, $defaults);

        $page_input[] = array(
            'name'  => __('标题：', 'zib_language'),
            'id'    => $this->get_field_name('title'),
            'std'   => $instance['title'],
            'style' => 'margin: 10px auto;',
            'type'  => 'text',
        );
        $page_input[] = array(
            'name'  => __('副标题：', 'zib_language'),
            'id'    => $this->get_field_name('mini_title'),
            'std'   => $instance['mini_title'],
            'style' => 'margin: 10px auto;',
            'type'  => 'text',
        );
        $page_input[] = array(
            'name'  => __('标题右侧按钮->文案：', 'zib_language'),
            'id'    => $this->get_field_name('more_but'),
            'std'   => $instance['more_but'],
            'style' => 'margin: 10px auto;',
            'type'  => 'text',
        );
        $page_input[] = array(
            'name'  => __('标题右侧按钮->链接：', 'zib_language'),
            'id'    => $this->get_field_name('more_but_url'),
            'std'   => $instance['more_but_url'],
            'desc'  => '设置为任意链接',
            'style' => 'margin: 10px auto;',
            'type'  => 'text',
        );
        $page_input[] = array(
            //    'name'  => __('显示背景盒子', 'zib_language'),
            'id'    => $this->get_field_name('hide_box'),
            'std'   => $instance['hide_box'],
            'desc'  => '不显示背景盒子',
            'style' => 'margin: 10px auto;',
            'type'  => 'checkbox',
        );
        
        echo zib_get_widget_show_type_input($instance,$this->get_field_name('show_type'));

        echo zib_edit_input_construct($page_input);
        ?>

  <?php
}
}

然后新建func.php或者在functions.php直接引入：

include('widgets-home-user.php');

最后在后台外观小工具里添加就可以了

第二种

直接下载本文的资源，然后

pic文件夹上传至网站根目录
inc文件夹、func.php、lizujun.css、index.php上传至子比主题根目录
默认头像后台替换一下