给自己的网站加一个作者主页功能

0809

因为自己的网站有一个荣誉墙，为了实现荣誉墙的第2个效果，就需要加一个作者主页功能。这两个相互配合简直天衣无缝。

荣誉墙在这里：

给自己的网站加个荣誉墙（读者墙）-大海博客
给自己的网站加个荣誉墙（读者墙）-大海博客
给自己的网站加个荣誉墙（读者墙）
战东海的头像-大海博客9个月前
110514

简单说明一下：

就是获取某个用户发了多少文章post、片刻moment和评论comment，统计一下数量然后列出来。

文章和评论的文字都是红色，因为片刻有的可能没有标题，如果有标题取《标题》，文字红色显示，如果没有标题取内容前30个文字，文字蓝色表示。以上全部带有链接，点击即可快速到达。

有两个效果：

效果一是普通的网页下翻，如果发布的数量少还可以，数量多的话不建议；

效果二是做成了像Widows选项卡一样可以相互切换的，现在本站用的这种，也比效果一好看。效果二分为效果二（1）和效果二（2），效果二（1）文章显示个数受到后台–设置–阅读设置–博客页面至多显示的个数限制，效果二（2）则不限制，会把作者发布的所有文章显示出来。

效果一如下图：

fstring 的作者主页

给自己的网站加一个作者主页功能-似水流年

效果二如下图：

给自己的网站加一个作者主页功能-似水流年

一、在pix主题目录下新建author.php代码如下：

效果一代码如下：

<?php get_header(); ?>

<style>    
    #content{margin:20px;background-color:#f7f7f7;padding:20px}h2{font-size:18px;margin-bottom:10px;color:#333;text-align:center;font-weight:bold}p{margin-bottom:5px;color:#333}ul{list-style-type:none;padding-left:0}.content-item{border:1px dashed #ccc;padding:10px;background-color:#fff;margin-bottom:10px}a{text-decoration:none;color:#333}.post-title{color:red}.comment-text{color:red}.moment-title{color:red}.moment-content{color:blue}</style>

<div id="content" class="narrowcolumn">

    <!– This sets the $curauth variable –>

    <?php
    if(isset($_GET['author_name'])) :
        $curauth = get_userdatabylogin($author_name);
    else :
        $curauth = get_userdata(intval($author));
    endif;

    // 获取用户ID
    $user_id = $curauth->ID;

    // 获取用户发布的文章数量
    $post_count = count_user_posts($user_id);
    // 获取用户发布的评论数量
    $comment_count = get_comments(array(
        'user_id' => $user_id,
        'count' => true,
    ));

    // 获取用户发布的片刻
    $moment_args = array(
        'author' => $user_id,
        'post_type' => 'moment',
        'post_status' => 'publish',
        'posts_per_page' => -1,
    );
    $moment_query = new WP_Query($moment_args);

    ?>

    <h2><?php echo $curauth->nickname; ?>的作者主页</h2>

    <h2><p>发布的文章数量: <?php echo $post_count; ?></p></h2>

    <ul>
        <!– The Loop –>

        <?php
        if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
            <li class="content-item">
                <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
                    <span class="post-title"><?php the_title(); ?></span></a>
            </li>

        <?php endwhile; else: ?>
            <p><?php _e('该用户尚未发布任何文章。'); ?></p>

        <?php endif; ?>

        <!– End Loop –>

    </ul>

    <?php if ( $moment_query->have_posts() ) : ?>
        <h2><p>发布的片刻数量: <?php echo $moment_query->post_count; ?></p></h2>
        <ul>
            <?php while ( $moment_query->have_posts() ) : $moment_query->the_post(); ?>
                <li class="content-item">
                    <?php
                    $moment_content = get_the_content();
                    $moment_text = wp_strip_all_tags($moment_content);
                    $moment_link = get_permalink();
                    ?>
                    <?php if ( get_the_title() ) : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-title">' . '《' . get_the_title() . '》' . '</span></a>'; ?>
                    <?php else : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-content">' . wp_trim_words( $moment_text, 30, '...' ) . '</span></a>'; ?>
                    <?php endif; ?>
                </li>
            <?php endwhile; ?>
        </ul>
        <?php wp_reset_postdata(); ?>
    <?php endif; ?>

    <?php
    $comments_args = array(
        'user_id' => $user_id,
        'status' => 'approve',
    );
    $comments = get_comments($comments_args);
    ?>

    <?php if ($comments) : ?>
        <h2><p>发布的评论数量: <?php echo $comment_count; ?></p></h2>
        <ul>
            <?php foreach ($comments as $comment) : ?>
                <li class="content-item">
                    <a href="<?php echo get_comment_link($comment); ?>">
                        <span class="comment-text"><?php echo get_comment_text($comment->comment_ID); ?></span>
                    </a>
                </li>
            <?php endforeach; ?>
        </ul>
    <?php endif; ?>

</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

效果二（1）代码如下：

<?php get_header(); ?>

<style>
    #content{margin:20px;background-color:#f7f7f7;padding:20px}h2{font-size:18px;margin-bottom:10px;color:#333;text-align:center;font-weight:bold}p{margin-bottom:5px;color:#333}ul{list-style-type:none;padding-left:0}.content-item{border:1px dashed #ccc;padding:10px;background-color:#fff;margin-bottom:10px}a{text-decoration:none;color:#333}.post-title{color:red}.comment-text{color:red}.moment-title{color:red}.moment-content{color:blue}.tab{overflow:hidden;background-color:#f1f1f1;display:flex;border-top-left-radius:10px;border-top-right-radius:10px}.tab a{flex:1;text-align:center;padding:14px 16px;text-decoration:none;color:#666;background-color:#f1f1f1;border:1px solid #ccc;border-bottom:none;border-top-left-radius:10px;border-top-right-radius:10px}.tab a.active{background-color:#ccc;color:#333;font-weight:bold;border-bottom-color:#f1f1f1}.tab a:hover{background-color:#ddd}.tabcontent{display:none;padding:20px;background-color:#f9f9f9;border:1px solid #ccc}</style>

<div id="content" class="narrowcolumn">

    <!-- This sets the $curauth variable -->
    <?php
    if(isset($_GET['author_name'])) :
        $curauth = get_userdatabylogin($author_name);
    else :
        $curauth = get_userdata(intval($author));
    endif;

    // 获取用户ID
    $user_id = $curauth->ID;

    // 获取用户发布的文章数量
    $post_count = count_user_posts($user_id);
    // 获取用户发布的评论数量
    $comment_count = get_comments(array(
        'user_id' => $user_id,
        'count' => true,
    ));

    // 获取用户发布的片刻
    $moment_args = array(
        'author' => $user_id,
        'post_type' => 'moment',
        'post_status' => 'publish',
        'posts_per_page' => -1,
    );
    $moment_query = new WP_Query($moment_args);

    // 获取用户发布的评论
    $comments_args = array(
        'user_id' => $user_id,
        'status' => 'approve',
    );
    $comments = get_comments($comments_args);

    ?>
    <h2><?php echo $curauth->nickname; ?>的作者主页</h2>

    <div class="tab">
        <a href="javascript:void(0);" class="tablinks active" onclick="openTab('articles')">文章(<?php echo $post_count; ?>)</a>
        <a href="javascript:void(0);" class="tablinks" onclick="openTab('moments')">片刻(<?php echo $moment_query->post_count; ?>)</a>
        <a href="javascript:void(0);" class="tablinks" onclick="openTab('comments')">评论(<?php echo $comment_count; ?>)</a>
    </div>

    <div id="articles" class="tabcontent" style="display: block;">
        <ul>
            <!-- The Loop -->
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                <li class="content-item">
                    <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
                        <span class="post-title"><?php the_title(); ?></span></a>
                </li>
            <?php endwhile; else: ?>
                <p><?php _e('该用户尚未发布任何文章。'); ?></p>
            <?php endif; ?>
            <!-- End Loop -->
        </ul>
    </div>

    <div id="moments" class="tabcontent">
        <ul>
            <?php if ( $moment_query->have_posts() ) : while ( $moment_query->have_posts() ) : $moment_query->the_post(); ?>
                <li class="content-item">
                    <?php
                    $moment_content = get_the_content();
                    $moment_text = wp_strip_all_tags($moment_content);
                    $moment_link = get_permalink();
                    ?>
                    <?php if ( get_the_title() ) : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-title">' . '《' . get_the_title() . '》' . '</span></a>'; ?>
                    <?php else : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-content">' . wp_trim_words( $moment_text, 30, '...' ) . '</span></a>'; ?>
                    <?php endif; ?>
                </li>
            <?php endwhile; else: ?>
                <p><?php _e('该用户尚未发布任何片刻。'); ?></p>
            <?php endif; ?>
        </ul>
    </div>

    <div id="comments" class="tabcontent">
        <ul>
            <?php if ($comments) : foreach ($comments as $comment) : ?>
                <li class="content-item">
                    <a href="<?php echo get_comment_link($comment); ?>">
                        <span class="comment-text"><?php echo get_comment_text($comment->comment_ID); ?></span>
                    </a>
                </li>
            <?php endforeach; else: ?>
                <p><?php _e('该用户尚未发布任何评论。'); ?></p>
            <?php endif; ?>
        </ul>
    </div>

</div>

<script>
    function openTab(evt, tabName) {
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(tabName).style.display = "block";
        evt.currentTarget.className += " active";
    }
    
    function openTab(tabName) {
    var i, tabcontent, tablinks;
    tabcontent = document.getElementsByClassName("tabcontent");
    for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "none";
    }
    tablinks = document.getElementsByClassName("tablinks");
    for (i = 0; i < tablinks.length; i++) {
        tablinks[i].className = tablinks[i].className.replace(" active", "");
    }
    document.getElementById(tabName).style.display = "block";
    document.querySelector(`[onclick="openTab('${tabName}')"]`).className += " active";
    }
    
</script>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

效果二（2）代码如下：

<?php get_header(); ?>

<style>
    #content{margin:20px;background-color:#f7f7f7;padding:20px}h2{font-size:18px;margin-bottom:10px;color:#333;text-align:center;font-weight:bold}p{margin-bottom:5px;color:#333}ul{list-style-type:none;padding-left:0}.content-item{border:1px dashed #ccc;padding:10px;background-color:#fff;margin-bottom:10px}a{text-decoration:none;color:#333}.post-title{color:red}.comment-text{color:red}.moment-title{color:red}.moment-content{color:blue}.tab{overflow:hidden;background-color:#f1f1f1;display:flex;border-top-left-radius:10px;border-top-right-radius:10px}.tab a{flex:1;text-align:center;padding:14px 16px;text-decoration:none;color:#666;background-color:#f1f1f1;border:1px solid #ccc;border-bottom:none;border-top-left-radius:10px;border-top-right-radius:10px}.tab a.active{background-color:#ccc;color:#333;font-weight:bold;border-bottom-color:#f1f1f1}.tab a:hover{background-color:#ddd}.tabcontent{display:none;padding:20px;background-color:#f9f9f9;border:1px solid #ccc}</style>

<div id="content" class="narrowcolumn">

    <!-- This sets the $curauth variable -->
    <?php
    if(isset($_GET['author_name'])) :
        $curauth = get_userdatabylogin($author_name);
    else :
        $curauth = get_userdata(intval($author));
    endif;

    // 获取用户ID
    $user_id = $curauth->ID;

    // 获取用户发布的文章数量
    $post_count = count_user_posts($user_id);
    // 获取用户发布的评论数量
    $comment_count = get_comments(array(
        'user_id' => $user_id,
        'count' => true,
    ));

    // 获取用户发布的片刻
    $moment_args = array(
        'author' => $user_id,
        'post_type' => 'moment',
        'post_status' => 'publish',
        'posts_per_page' => -1,
    );
    $moment_query = new WP_Query($moment_args);

    // 获取用户发布的评论
    $comments_args = array(
        'user_id' => $user_id,
        'status' => 'approve',
    );
    $comments = get_comments($comments_args);

    ?>
    <h2><?php echo $curauth->nickname; ?>的作者主页</h2>

    <div class="tab">
        <a href="javascript:void(0);" class="tablinks active" onclick="openTab('articles')">文章(<?php echo $post_count; ?>)</a>
        <a href="javascript:void(0);" class="tablinks" onclick="openTab('moments')">片刻(<?php echo $moment_query->post_count; ?>)</a>
        <a href="javascript:void(0);" class="tablinks" onclick="openTab('comments')">评论(<?php echo $comment_count; ?>)</a>
    </div>

    <div id="articles" class="tabcontent" style="display: block;">
        <ul>
            <!-- The Loop -->
            <?php
            $author_posts = new WP_Query( array(
                'author' => $user_id,
                'post_type' => 'post',
                'post_status' => 'publish',
                'posts_per_page' => -1,
            ) );
            if ( $author_posts->have_posts() ) : while ( $author_posts->have_posts() ) : $author_posts->the_post();
            ?>
                <li class="content-item">
                    <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
                        <span class="post-title"><?php the_title(); ?></span>
                    </a>
                </li>
            <?php endwhile; else: ?>
                <p><?php _e('该用户尚未发布任何文章。'); ?></p>
            <?php endif; ?>
            <!-- End Loop -->
        </ul>
    </div>

    <div id="moments" class="tabcontent">
        <ul>
            <?php if ( $moment_query->have_posts() ) : while ( $moment_query->have_posts() ) : $moment_query->the_post(); ?>
                <li class="content-item">
                    <?php
                    $moment_content = get_the_content();
                    $moment_text = wp_strip_all_tags($moment_content);
                    $moment_link = get_permalink();
                    ?>
                    <?php if ( get_the_title() ) : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-title">' . '《' . get_the_title() . '》' . '</span></a>'; ?>
                    <?php else : ?>
                        <?php echo '<a href="' . $moment_link . '"><span class="moment-content">' . wp_trim_words( $moment_text, 30, '...' ) . '</span></a>'; ?>
                    <?php endif; ?>
                </li>
            <?php endwhile; else: ?>
                <p><?php _e('该用户尚未发布任何片刻。'); ?></p>
            <?php endif; ?>
        </ul>
    </div>

    <div id="comments" class="tabcontent">
        <ul>
            <?php if ($comments) : foreach ($comments as $comment) : ?>
                <li class="content-item">
                    <a href="<?php echo get_comment_link($comment); ?>">
                        <span class="comment-text"><?php echo get_comment_text($comment->comment_ID); ?></span>
                    </a>
                </li>
            <?php endforeach; else: ?>
                <p><?php _e('该用户尚未发布任何评论。'); ?></p>
            <?php endif; ?>
        </ul>
    </div>

</div>

<script>
    function openTab(evt, tabName) {
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(tabName).style.display = "block";
        evt.currentTarget.className += " active";
    }
    
    function openTab(tabName) {
    var i, tabcontent, tablinks;
    tabcontent = document.getElementsByClassName("tabcontent");
    for (i = 0; i < tabcontent.length; i++) {
        tabcontent[i].style.display = "none";
    }
    tablinks = document.getElementsByClassName("tablinks");
    for (i = 0; i < tablinks.length; i++) {
        tablinks[i].className = tablinks[i].className.replace(" active", "");
    }
    document.getElementById(tabName).style.display = "block";
    document.querySelector(`[onclick="openTab('${tabName}')"]`).className += " active";
    }
    
</script>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

二、加入右上角登录后控制台下方。

给自己的网站加一个作者主页功能-似水流年

修改pix/layouts/header-tool.php，找到

<a href="<?php echo home_url('/wp-admin'); ?>" target="_blank" pjax="exclude"><i class="ri-function-line"></i>控制台</a>

在其下方加入如下代码：

<?php 
      if (is_user_logged_in()) {
         $current_user = wp_get_current_user();
         $author_url = home_url('/author/') . $current_user->user_login; 
?>
<a href="<?php echo $author_url; ?>"><i class="ri-user-3-fill"></i>我的主页</a>
<?php } ?>

这样登录用户可以直接查看自己的主页。

更新缓存，大功告成！

© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
WordPress插件
# 美化# 主题美化# WP美化# WordPress插件
喜欢就支持一下吧
点赞9赞赏 分享
战东海的头像-大海博客
直播源m3u集合 国内外直播源-IPTV URL TVBOX-大海博客
直播源m3u集合 国内外直播源-IPTV URL TVBOX
直播源m3u集合 国内外直播源-IPTV URL TVBOX
9个月前 7794
Alist安装/升级/卸载-大海博客
Alist安装/升级/卸载
Alist安装/升级/卸载
1年前 2233
一为导航主题-集网址、资源、资讯于一体的WordPress导航主题-大海博客
一为导航主题-集网址、资源、资讯于一体的WordPress导航主题
一为导航主题-集网址、资源、资讯于一体的WordPress导航主题
1年前 599
memos 使用指南：自建一个备忘录中心服务-大海博客
memos 使用指南：自建一个备忘录中心服务
memos 使用指南：自建一个备忘录中心服务
1年前 577
异次元发卡（荔枝发卡）搭建教程——图文版-大海博客
异次元发卡（荔枝发卡）搭建教程——图文版
异次元发卡（荔枝发卡）搭建教程——图文版
1年前 485
FongMi蜂蜜版电视tvbox盒子APK（持续更新）-大海博客
FongMi蜂蜜版电视tvbox盒子APK（持续更新）
FongMi蜂蜜版电视tvbox盒子APK（持续更新）
9个月前 470
相关推荐
Wp Douban – WordPress豆瓣插件-大海博客
Wp Douban – WordPress豆瓣插件
Wp Douban – WordPress豆瓣插件
1年前 349
如何让子比主题支持AI摘要，使用TianliGPT自动生成文章的AI摘要-大海博客
如何让子比主题支持AI摘要，使用TianliGPT自动生成文章的AI摘要
如何让子比主题支持AI摘要，使用TianliGPT自动生成文章的AI摘要
1年前 278
ThnBoV1.5.0-一款针对WordPress开发的缩略图美化插件,-大海博客
ThnBoV1.5.0-一款针对WordPress开发的缩略图美化插件,
ThnBoV1.5.0-一款针对WordPress开发的缩略图美化插件,
1年前 193
WordPress 主题添加鼠标跟随特效-大海博客
WordPress 主题添加鼠标跟随特效
WordPress 主题添加鼠标跟随特效
1年前 150
PIX主题添加注册弹窗功能实现会员间互动-大海博客
PIX主题添加注册弹窗功能实现会员间互动
PIX主题添加注册弹窗功能实现会员间互动
11个月前 124
友链的朋友圈 RSS的聚合页 （WordPress->PIX主题篇）-大海博客
友链的朋友圈 RSS的聚合页 （WordPress->PIX主题篇）
友链的朋友圈 RSS的聚合页 （WordPress->PIX主题篇）
9个月前 123
评论 抢沙发
头像
欢迎您留下宝贵的见解！
提交
头像

昵称

取消
昵称

请填写用户信息：

  • 昵称(必填)
  • 邮箱(必填)
表情
[aoman][baiyan][bishi][bizui][cahan][ciya][dabing][daku][deyi][doge][fadai][fanu][fendou][ganga][guzhang][haixiu][hanxiao][zuohengheng][zhuakuang][zhouma][zhemo][zhayanjian][zaijian][yun][youhengheng][yiwen][yinxian][xu][xieyanxiao][xiaoku][xiaojiujie][xia][wunai][wozuimei][weixiao][weiqu][tuosai][tu][touxiao][tiaopi][shui][se][saorao][qiudale][qinqin][qiaoda][piezui][penxue][nanguo][liulei][liuhan][lenghan][leiben][kun][kuaikule][ku][koubi][kelian][keai][jingya][jingxi][jingkong][jie][huaixiao][haqian][aini][OK][qiang][quantou][shengli][woshou][gouyin][baoquan][aixin][bangbangtang][xiaoyanger][xigua][hexie][pijiu][lanqiu][juhua][hecai][haobang][caidao][baojin][chi][dan][kulou][shuai][shouqiang][yangtuo][youling]
代码

请输入代码：

确认
图片

    暂无评论内容

默认头像
直播源m3u集合 国内外直播源-IPTV URL TVBOX-大海博客
7794人已阅读
直播源m3u集合 国内外直播源-IPTV URL TVBOX
TOP1
Alist安装/升级/卸载-大海博客
Alist安装/升级/卸载
1年前2233人已阅读
TOP2
一为导航主题-集网址、资源、资讯于一体的WordPress导航主题-大海博客
一为导航主题-集网址、资源、资讯于一体的WordPress导航主题
1年前599人已阅读
TOP3
memos 使用指南：自建一个备忘录中心服务-大海博客
memos 使用指南：自建一个备忘录中心服务
1年前577人已阅读
TOP4
异次元发卡（荔枝发卡）搭建教程——图文版-大海博客
异次元发卡（荔枝发卡）搭建教程——图文版
1年前485人已阅读
TOP5
FongMi蜂蜜版电视tvbox盒子APK（持续更新）-大海博客
FongMi蜂蜜版电视tvbox盒子APK（持续更新）
9个月前470人已阅读
TOP6
头像

wnyun前天0

223 0 谢谢分享
头像

2232天前0

谢谢分享
头像

我爱看爱看我需要需要，请让我查看6天前0

我需要看这个
头像

阿斯顿7天前0

ask多久啊可是大家啊可是觉得na
头像

是撒旦阿三8天前0

微软微软微软为热舞
头像

是是是14天前0

是是是少时诵诗书
lyx2021的头像-大海博客

lyx202115天前0

看蓝，可以用不
waltshen的头像-大海博客

waltshen39天前0

看看试一下
标签云
音乐 (1)青龙面板 (1)随机点名系统 (1)随机抽取系统 (1)阿里堆友 (1)豆瓣插件 (1)豆瓣 (1)说说 (1)设计 (1)解析源码 (1)视频源码 (2)视频 (2)荣誉墙 (1)苹果主题 (4)苹果cms主题 (1)苹果cms (3)聚合登入插件 (1)聊天源码 (1)美化 (7)缩略图美化 (1)