自定义 html 带有头像和回复的 Wordpress 评论

Question

我正在开发一个主题，不知道 wordpress 如何处理评论输出。

我的 comments.php 中有 wp_list_comments，但我不确定如何自定义输出以获得所需的输出，如下所示：

这是我的 html 代码：

  <div class="row">
    <div class="col-sm-2 text-center">
      <img src="https://freeiconshop.com/wp-content/uploads/edd/person-flat.png" class="img-circle" height="65" width="65" alt="Avatar">
    </div>
    <div class="col-sm-10">
      <h4>John Row <small>Sep 25, 2015, 8:25 PM</small></h4>
      <p>I am so happy for you man! Finally. I am looking forward to read about your trendy life. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
      <br>
      <p><span class="badge">1</span> Comment:</p><br>
      <div class="row">
        <div class="col-sm-2 text-center">
          <img src="http://www.noviasalcedo.es/wp-content/uploads/2016/05/person-girl-flat.png" class="img-circle" height="65" width="65" alt="Avatar">
        </div>
        <dsiv class="col-xs-10">
          <h4>Nested Bro <small>Sep 25, 2015, 8:28 PM</small></h4>
          <p>Me too! WOW!</p>
          <br>
        </div>
      </div>
    </div>

关于如何自定义 wp_list_comments 呈现的输出有什么建议吗？

#更新

comments.php:

<div id="comments" class="comments-area">

    <?php if ( have_comments() ) : ?>
        <h2 class="comments-title">
            <?php
                $comments_number = get_comments_number();

                    printf(
                        /* translators: 1: number of comments, 2: post title */
                        _nx(
                            '<p><span class="badge">%1$s</span> Comments:</p><br>',
                            '<p><span class="badge">%1$s</span> Comments:</p><br>',
                            $comments_number,
                            'comments title'
                        ),
                        number_format_i18n( $comments_number )
                    );
            ?>
        </h2>




<ol class="commentlist">
    <?php wp_list_comments('type=comment&callback=mytheme_comment');
   ?>
</ol><!-- .commentlist -->


    <?php endif; // Check for have_comments(). ?>



    <?php
        comment_form( array(
            'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title">',
            'title_reply_after'  => '</h2>',
        ) );
    ?>

</div><!-- .comments-area -->

Answer 1

您可以使用 wp_list_comments 函数覆盖模板。

Refer to this link.

您可以将该代码放入一个函数中，然后从 wp_list_comments 中调用它作为回调。关于如何做到这一点的所有信息都在 link.

中

Answer 2

您可以在 wp_list_comments() 函数上使用回调函数。

wp_list_comments();

通常，您会在 wordpress 主题的 comments.php 文件中找到这一行。此命令的输出是一个非常简单的 HTML 结构。

Wordpress 可以选择将回调函数作为参数传递给 wp_list_comments 函数。

这个回调函数应该 return 修改后的 HTML 评论部分的结构，我们正在寻求实现。

<ul class="comment-list comments">
    <?php
    wp_list_comments( array(
        'style'      => 'ul',
        'short_ping' => true,
            'callback' => 'better_comments'
    ) );
     ?>
</ul><!-- .comment-list -->

你可以在这里查看详细教程

https://www.5balloons.info/custom-html-for-comments-section-in-wordpress-theme/

自定义 html 带有头像和回复的 Wordpress 评论

Custom html Wordpress Comments with avatar and reply

html

php

wordpress

comments

#更新