In website operation, comments are an important element to enhance user interaction and community vitality.However, it is an indispensable link to review the comments submitted by users to ensure the health and quality of the website content.How can we flexibly display these comments in Anqi CMS, especially when they are still in the review stage, which has become a concern for many operators.commentListTags, which can help us easily achieve conditional display of comments.

UnderstandingcommentListTags comment status

commentListThe tag is a core tool in AnQi CMS used to retrieve the comment list of a specified document. When we use this tag to loop through comments, each comment item (usually nameditemThis includes a series of detailed information, one of the most crucial fields beingStatus.

StatusThe field is the key to determining the current review status of comments. Its values usually have two cases:

  • Status = 1: Indicates that the comment has passed review and can be displayed normally to all visitors.
  • Status = 0: Indicates that the comment is under review and has not yet been approved by the administrator.

UnderstoodStatusThe meaning of the field, we can use logical judgment in the template, and display comments differently according to their different states.

Practical application ofStatusDisplay comments based on field conditions

In the template, we can combine the provided by AnQi CMSiflogical judgment tags, toitem.StatusThe field makes conditional judgments. This way, we can precisely control the display of each comment under different review states, thereby optimizing the user experience.

Suppose we want to display all comments in the comment section, but give a clear prompt for comments that are being reviewed, rather than hiding them completely. We can write the template code like this:

{# 假设archive.Id是当前文档的ID #}
{% commentList comments with archiveId=archive.Id type="list" limit="10" %}
    {% for item in comments %}
    <div class="comment-item">
      <div class="comment-header">
        <span>
          {% if item.Status != 1 %} {# 如果评论未通过审核 #}
          <span style="color: gray;">[审核中]</span> {{item.UserName|truncatechars:6}}
          {% else %} {# 评论已通过审核 #}
          {{item.UserName}}
          {% endif %}
        </span>
        {% if item.Parent %} {# 如果是回复，显示回复对象 #}
        <span>回复</span>
        <span>
          {% if item.Parent.Status != 1 %}
          <span style="color: gray;">[审核中]</span> {{item.Parent.UserName|truncatechars:6}}
          {% else %}
          {{item.Parent.UserName}}
          {% endif %}
        </span>
        {% endif %}
        <span class="comment-time">{{stampToDate(item.CreatedTime, "2006-01-02 15:04")}}</span>
      </div>
      <div class="comment-content">
        {% if item.Parent and item.Parent.Status != 1 %} {# 如果父级评论在审核中 #}
        <blockquote style="border-left: 3px solid #ccc; padding-left: 10px; margin-left: 20px; color: gray;">
          该回复的原始评论正在审核中...
        </blockquote>
        {% elif item.Parent %} {# 如果父级评论已通过审核 #}
        <blockquote style="border-left: 3px solid #ccc; padding-left: 10px; margin-left: 20px;">
          {{item.Parent.Content|truncatechars:100}} {# 截断显示父级评论内容 #}
        </blockquote>
        {% endif %}

        {% if item.Status != 1 %} {# 当前评论在审核中 #}
          <p style="color: orange;">您的评论已提交，正在等待审核中...</p>
          <p style="color: gray; font-style: italic;">{{item.Content|truncatechars:30}}</p> {# 审核中可以截断显示部分内容或完全隐藏 #}
        {% else %} {# 当前评论已通过审核 #}
          <p>{{item.Content}}</p>
        {% endif %}
      </div>
      <div class="comment-actions">
        {% if item.Status == 1 %} {# 只有已通过审核的评论才能点赞和回复 #}
        <a class="item" data-id="praise">赞(<span class="vote-count">{{item.VoteCount}}</span>)</a>
        <a class="item" data-id="reply">回复</a>
        {% endif %}
      </div>
    </div>
    {% endfor %}
{% endcommentList %}

In the above example:

  • We pass{% if item.Status != 1 %}to determine whether the comment is under review.
  • For comments under review, we added the username to[审核中]The prompt is displayed in gray text, and the content part shows a friendly prompt such as "Your comment has been submitted and is waiting for review...", and can truncate the display of part of the comment to let the user know that their comment has been successfully submitted.
  • For comments that have been approved, the username and full content are displayed normally.
  • At the same time, for replies (sub-comments), we also consider the review status of the parent comment. If the parent comment is also under review, a corresponding prompt will be given.
  • Like and reply interactions, we also only allow comments that have passed the review.

Optimize user experience and advanced applications

In addition to the basic condition display mentioned above, we can further optimize according to the actual operational strategy:

  1. Completely hide comments under reviewIf you want the comments under review to be completely invisible on the front end, just{% if item.Status == 1 %}used as the external wrapper for comments, only comments that have passed the review will be rendered.
    
{% commentList comments with archiveId=archive.Id type="list" limit="10" %}
    {% for item in comments %}
    {% if item.Status == 1 %} {# 仅显示已通过审核的评论 #}
    <div class="comment-item">
      {# 评论的正常显示内容 #}
    </div>
    {% endif %}
    {% endfor %}
{% endcommentList %}
  2. Personalized prompts: In addition to the simple 'Under review', you can customize more detailed and guiding prompt text in the template, such as 'Your comment has been submitted successfully, and we will complete the review within 24 hours, please wait patiently.'
  3. Combine user roles: Although the AnQi CMS template tags do not directly provide a frontend function to judge whether the current user is an administrator, in practice, if combined with backend logic or frontend login status judgment, it can realize that only administrators can see all comments (including those under review) and ordinary users can only see the advanced features of comments that have been approved.This usually requires more in-depth secondary development to expand the template context variables.

Summary

Of Security CMScommentListTags and its built-inStatusfields, providing us with powerful capabilities for fine-grained display of comments on the website front-end. By flexibly utilizingifLogical judgment, we can easily distinguish and handle comments under review, whether it is to completely hide, give a friendly reminder, or truncate part of the content, it can effectively improve user experience while ensuring the quality of content.合理规划和使用这些功能，将有助于您构建一个健康、活跃且用户友好的在线社区。

Frequently Asked Questions (FAQ)

Q1: Why did I set upStatus == 0But the comments in review still haven't shown up? A1:commentListTags by default will only return and displayStatus = 1(which have passed the review) comments. If you want to display them on the front endStatus = 0comments under review, you need to explicitly add them in the template{% if item.Status == 0 %}or{% if item.Status != 1 %}logic to render these comments, otherwise they will not be output directly by the tag.

Q2: Can I customize the prompt text or style of 'Under review'? A2: Of course. In the template, when you use{% if item.Status != 1 %}Determine when a comment is in review status, you can freely insert any HTML structure, text content, or CSS style in the corresponding code block to meet your design and user experience needs.For example, you can display 'Comment submitted, waiting for admin review, thank you for your participation!'}]Or set a semi-transparent background for comments under review.

Q3: If I want to differentiate between ordinary users and administrators on the front-end, so that administrators can see all comments (including those under review) and ordinary users can only see approved comments, how should I implement this? A3In the pure template level of AnQi CMS, the functional tag for directly determining whether the visitor is an administrator is usually not provided directly, as user authentication and permission management tend to be handled by backend logic. If you have such a need, you can consider the following solutions:

  1. Backend processing: Being calledcommentListIn the backend controller of the tag, the comment list is pre-filtered according to the role of the currently logged-in user.If the user is an administrator, return all comments; if it is a regular user, only return comments that have been approved.
  2. Combining front-end with user role dataIf your website has already obtained user role information in the front-end through other means (such as JavaScript from localStorage or cookie), you can combine JS logic in the template to make judgments and render, but this will increase the complexity of the front-end.
  3. Template tag extension (secondary development): By二次开发安企CMS, you can customize an additional template tag to determine if the current user has admin privileges and tocommentListPerforming judgment and display in the loop.