首页 视频课程 主题开发课程第07章、文章评论 WordPress修改评论列表结构

WordPress修改评论列表结构

2023-06-11 / 218阅

下面是修改 WordPress 评论列表结构的示例代码:

// 移除默认的评论列表样式
function remove_comment_style() {
    global $wp_widget_factory;
    remove_action('wp_head', array($wp_widget_factory->widgets['WP_Widget_Recent_Comments'], 'recent_comments_style'));
}
add_action('widgets_init', 'remove_comment_style');

// 自定义评论列表样式
function custom_comment_list($comment, $args, $depth) {
    $GLOBALS['comment'] = $comment; ?>

    <li <?php comment_class(); ?> id="comment-<?php comment_ID(); ?>">
        <div class="comment-author vcard">
            <?php echo get_avatar($comment, $size = '50', $default = ''); ?>
            <?php printf(__('<cite class="fn">%s</cite>'), get_comment_author_link()); ?>
        </div>

        <div class="comment-meta commentmetadata">
            <a href="<?php echo htmlspecialchars(get_comment_link($comment->comment_ID)); ?>">
                <?php printf(__('%1$s at %2$s'), get_comment_date(),  get_comment_time()); ?>
            </a>
        </div>

        <?php if ($comment->comment_approved == '0') : ?>
            <em><?php _e('Your comment is awaiting moderation.'); ?></em><br />
        <?php endif; ?>

        <div class="comment-text"><?php comment_text(); ?></div>

        <div class="reply">
            <?php comment_reply_link(array_merge($args, array('depth' => $depth, 'max_depth' => $args['max_depth']))); ?>
        </div>
    </li>
<?php }

// 调用自定义评论列表样式
function custom_comments($comment, $args, $depth) {
    $GLOBALS['comment'] = $comment;
    if ($GLOBALS['comment']->comment_type == 'pingback' || $GLOBALS['comment']->comment_type == 'trackback') : ?>
        <li class="pingback">
            <p><?php _e( 'Pingback:'); ?> <?php comment_author_link(); ?> <?php edit_comment_link( __( '(Edit)' ), ' ' ); ?>
            </p>
        </li>
    <?php else : ?>
        <?php custom_comment_list($comment, $args, $depth); ?>
    <?php endif; 
}

// 替换默认评论列表样式
function replace_comment_list($comment, $args, $depth) {
    $GLOBALS['comment'] = $comment;
    ?>
    <div id="comment-<?php comment_ID(); ?>" <?php comment_class(); ?>>
        <?php custom_comments($comment, $args, $depth); ?>
    </div>
    <?php 
}

// 定义新的评论列表样式
function custom_comment_style() {
    wp_list_comments(array(
        'style' => 'div',
        'callback' => 'replace_comment_list',
    ));
}

// 调用新的评论列表样式
add_action('comments_list', 'custom_comment_style'); 

使用上述代码,会将默认的 WordPress 评论列表样式替换成自定义样式。自定义样式包括评论者头像、作者名字、发表时间、评论内容和回复链接。

要想使用这些代码,将它们添加到 theme 的 functions.php 文件中即可。注意修改样式以便适应你的网站主题。

阅读文章或者观看视频过程中有任何问题,请下方留言或者联系我Q248758228

大家谈论
    我的见解
    目录