主页/WordPress笔记/博客文章/综合文章/如何在 WordPress 侧边栏显示热门评论者

如何在 WordPress 侧边栏显示热门评论者

Bug编译狮

Bug编译狮

要在 WordPress 侧边栏显示热门评论者,你可以通过以下步骤实现:

步骤 1: 导入数据到数据库

首先,你需要创建一个名为 comments 的表来存储评论者的数据。这个表应该包含一些基本的评论者信息,如用户名、日期等。

CREATE TABLE IF NOT EXISTS comments (
    id INT(11) AUTO_INCREMENT PRIMARY KEY,
    commenter_name VARCHAR(255),
    comment_date DATETIME DEFAULT CURRENT_TIMESTAMP
);

然后,编写一个 SQL 查询来插入一些测试数据(假设我们有三个评论者):

INSERT INTO comments (commenter_name)
VALUES ('John Doe'), ('Jane Smith'), ('Alice Johnson');

步骤 2: 创建自定义功能插件

接下来,我们需要创建一个自定义功能插件,以便在侧边栏显示这些评论者。我们将使用 WordPress 动态模板函数和条件语句来过滤和显示这些评论者。

  1. 创建一个新的 PHP 文件:例如 sidebar.php
  2. 添加以下代码
<?php 
function display_top_commenters() {
    $query_args = array(
        'post_type' => 'comment',
        'posts_per_page' => -1, // 显示所有评论
        'meta_key' => '_wp_old_slug', // 使用旧的 slug 字段作为排序依据
        'orderby' => 'meta_value_num'
    );

    $comments_query = new WP_Query($query_args);

    if ($comments_query->have_posts()) : ?>
        <div class="top-commenters">
            <?php while ($comments_query->have_posts()) : $comments_query->the_post(); ?>
                <article>
                    <h3><?php the_title(); ?></h3>
                    <time datetime="<?php echo get_the_time('c'); ?>"><?php echo get_the_date(); ?></time>
                </article>
            <?php endwhile; ?>
        </div>
    <?php endif;

    wp_reset_postdata();
}
?>

<div class="side-bar" style="position:relative;">
    <?php display_top_commenters(); ?>
</div>

<style type="text/css">
.top-commenters article {
    background-color: #f9f9f9;
    padding: 10px;
    border-radius: 5px;
}

.top-commenters h3 {
    font-size: 18px;
    margin-bottom: 5px;
}

.top-commenters time {
    color: gray;
}
</style>

步骤 3: 在侧边栏加载自定义功能插件

现在,你需要在 WordPress 管理面板的 “插件” 页面找到并启用你刚刚创建的自定义功能插件。

步骤 4: 测试结果

刷新网站页面,你应该会看到一个位于侧边栏的区域,其中显示了所有评论者的用户名和评论时间。

效果说明

  • 这个解决方案利用了 WordPress 的动态模板函数和自定义功能插件,实现了根据评论者的最新发表时间和评论者名称在侧边栏显示热门评论者。
  • 数据库中的评论者信息被用来排序和筛选出最新的评论者,从而展示最受欢迎的用户。
  • 通过 CSS 样式美化了输出的内容,使其更加直观易读。

希望这能帮助你在 WordPress 中实现热门评论者列表的功能!如果有任何问题或需要进一步的帮助,请随时提问。

黑板前的Bug语法讲师

黑板前的Bug语法讲师

如何在 WordPress 侧边栏显示热门评论者

目标读者

  • 对于有经验的 WordPress 用户,特别是熟悉主题开发和插件使用的人。
  • 需要了解如何在网站上展示用户评价或评论功能。

教学目标

  1. 熟悉 WordPress 的评论系统
  2. 使用自定义模板来定制评论区
  3. 使用插件(如 WP Comment Loops)来显示热门评论者

教学步骤

步骤 1: 设置评论布局

首先,我们需要创建一个评论区域并设置其样式。这通常是在主题文件夹下的 functions.php 文件中完成的。

add_action('wp_head', 'my_custom_comment_style');
function my_custom_comment_style() {
    wp_add_inline_style( 'custom-style' , '@media screen and (max-width: 600px) { .comment{ margin-top: 5px; } }' );
}

步骤 2: 创建自定义模板

接下来,我们为评论区域创建一个新的模板文件,例如 single-comment.phpcomments-template.php。这个模板将包含所有的评论信息。

<?php if ( have_comments() ) : ?>
    <div id="respond">
        <?php comments_template( '', true ); ?>
    </div><!-- #respond -->
<?php endif; ?>

步骤 3: 使用插件显示热门评论者

我们可以使用 WP Comment Loops 插件来显示评论者的名字、头像以及他们最近发表的文章数量。首先,安装并激活该插件:

wp plugin activate wp-comment-loops

然后,在 functions.php 中添加以下代码以启用插件的功能:

// Enable the WP Comment Loops feature.
if ( ! function_exists( 'enable_wp_comment_loops' ) ) {
    add_filter( 'comment_form_default_html', 'enable_wp_comment_loops' );
}

function enable_wp_comment_loops( $html ) {
    global $post;

    // Check for a loop-enabled post ID.
    if ( isset( $_GET['comment'] ) && ! empty( $post->ID ) && is_singular() ) {

        // Get all of the comment authors in the current post.
        $authors = get_comment_authors();

        // Loop through the comment authors and display them with their information.
        foreach ( $authors as $author ) {
            $avatar_url = get_avatar( $author, 48 );

            // Display the author's name, avatar, and number of posts they've made.
            $output .= '<a href="' . esc_url( get_author_posts_url( $author->ID ) ) . '">' .
                       esc_html( $author->display_name ) . '</a>';
            $output .= '<img src="' . esc_attr( $avatar_url ) . '" alt="" />';
            $output .= '<span class="num-posts">' . get_count_posts( $author->ID ) . '</span>';

            // Add a separator between authors.
            $output .= "n";
        }

        return $html . '<ul>' . $output . '</ul>';
    }

    return $html;
}

步骤 4: 配置 WordPress 主题以显示评论者信息

为了确保新设计可以正常工作,需要对 WordPress 主题进行一些配置调整。

  1. 修改 functions.php

    • 添加以下代码到主题的 functions.php 文件中:
      function custom_css() {
       wp_enqueue_style( 'theme-style', get_stylesheet_uri(), array(), filemtime(get_stylesheet_directory_uri() . '/style.css') );
      }

      这将在每个页面加载时执行此函数,并动态地应用 CSS 样式。

  2. 修改 .css 文件

    • 在主题的 <body> 标签内添加以下代码:
      /* Show comment author names */
      .comment-author {
      font-size: 14px;
      }

    这些更改会使得评论区域中的作者姓名字体大小变为14像素,以便更容易阅读。

通过以上步骤,您现在应该可以在 WordPress 侧边栏看到显示热门评论者的功能了。