In today's digital world, websites are not only platforms for displaying information, but also spaces for user interaction and communication.When users can express their opinions on the content and raise questions, the vitality of the website will greatly increase.commentListIt is the key bridge connecting content and user feedback.

Imagine that you have published an engaging article or an innovative product, and after reading it, users can't wait to share their thoughts.As a website operator, you naturally want these valuable comments to be clearly and orderly presented below the content.commentListTags are born for this, allowing you to easily obtain and display user comments on your website content, making interaction accessible.

Deep understandingcommentListtags

commentListThe tag is a core feature provided by the Anqie CMS template engine, which mainly serves to retrieve and display all comments related to specific content (such as articles, products).This tag can meet your needs whether you need to display the latest comments, popular comments, or add a comment section to the content detail page.

to usecommentList，You usually introduce it in the detail template of the content (such as article detail pagearchive/detail.html）。Its basic structure is as follows, you will assign the obtained comment data to a variable (such ascommentsThen, by looping through this variable, each comment is displayed one by one:

{% commentList comments with archiveId=archive.Id type="list" limit="6" %}
    {# 在这里，您将循环输出每条评论的详细信息 #}
{% endcommentList %}

In this code,archive.IdIt usually represents the content ID of the current page,type="list"It means to get comments in a list form,limit="6"Limited to displaying six comments each time.

Flexible control over the retrieval and display of comments

commentListTags provide various parameters, allowing you to finely control the way comments are retrieved:

  • archiveId：This is the most important parameter, it specifies the content ID of the comments you want to retrieve. For example,archiveId="1"Will get all comments for the content with ID 1.If you do not specify this parameter on the content detail page (such as the article detail page), Anqi CMS will intelligently automatically obtain the content ID of the current page, which is very convenient.
  • type：Determines the display style of the comment list. When set to"list"When set to, the tag will return a specified number of comments; while set to"page"it will return a comment list containing pagination information, which you can combinepaginationthe tag to implement comment pagination display.
  • limit：Used to control the number of comments retrieved each time. For example,limit="10"will display the latest 10 comments. If you need more advanced offset control,"2,10"This format indicates that starting from the second comment, 10 comments are retrieved.
  • order: Defines the sorting method of comments. You can choose"id desc"(Sorted by ID in reverse order, usually with the latest comments at the top) or"id asc"(Sorted by ID in ascending order, oldest comment first).
  • siteIdIf you have enabled the multi-site management feature of Safe CMS and want to call comment data from other sites, you can specify the site ID through this parameter.

Detailed fields of comment data

ThroughcommentListLabeling the comment data retrieved, you can access various fields of each comment in the loop to construct the comment display area.itemVariables (in)for item in commentsdefined) will carry the detailed information of each comment:

  • Id: The unique ID of the comment.
  • ArchiveId：The ID of the content to which the comment belongs.
  • UserName：The name of the user who posted the comment.
  • Content: The specific content of the comment.
  • ParentId：If this is a reply comment, this field will store the ID of the parent comment.
  • ParentThis is a very practical field, which directly contains the complete data object of the parent comment.This allows you to easily build multi-level conversation threads, also known as 'building' comments.
  • Status：The review status of the comments.1It usually indicates that the review has been approved and displayed.0It means that the review is in progress. When displaying comments, you should decide whether to show the comment content based on this status.
  • VoteCount：Comments' like count, which can be used to implement the comment like function.
  • CreatedTime：Comments' posting time (timestamp format). You need to combinestampToDateThe filter formats it into a readable date and time.

For example, show the username, content, and time of the user who posted the comment:

{% commentList comments with archiveId=archive.Id type="list" limit="6" %}
    {% for item in comments %}
    <div>
      <div>
        <span>{{item.UserName}}</span>
        <span>于 {{stampToDate(item.CreatedTime, "2006-01-02 15:04")}} 评论道：</span>
      </div>
      <div>
        {% if item.Status == 1 %}
          {{item.Content}}
        {% else %}
          该内容正在审核中。
        {% endif %}
      </div>
    </div>
    {% endfor %}
{% endcommentList %}

Build a paginated list of comments

When your content has a large number of comments, pagination becomes very necessary. commentListoftypeparameter settings"page"Then combine with the Aqiyi CMS, paginationtags, you can easily achieve an elegant pagination effect.

Firstly,commentListGet pagination data:

{% commentList comments with archiveId=archive.Id type="page" limit="10" %}
    {# 评论列表内容 #}
{% endcommentList %}

Then, incommentListBelow the tag, usepaginationTags to render pagination navigation:

<div>
    {% pagination pages with show="5" %}
        {# 渲染分页链接，如首页、上一页、数字页码、下一页、尾页等 #}
        <ul>
            <li>总数：{{pages.TotalItems}}条，总共：{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页</li>
            <li class="{% if pages.FirstPage.IsCurrent %}active{% endif %}"><a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a></li>
            {# ...其他分页链接... #}
        </ul>
    {% endpagination %}
</div>

Through this method, users can easily browse all comments without feeling lag due to too much content on a single page.

Comment submission and interaction

In addition to displaying comments, Anqi CMS also provides convenient interfaces for handling user submitted comments and likes:

  • Submit CommentYou can create an HTML form, and thenactionpointing to/comment/publishThe form must includearchive_id（Content ID）、user_name(Username),content(Comment content), if you want to implement the reply function, you can also addparent_idField. To prevent spam comments, it is recommended that you enable comment captcha in the background and integrate captcha display in the form (refer to)tag-/anqiapi-other/167.htmlof the instructions).
  • Like a comment: Anqi CMS allows you to/comment/praiseThe address sends a POST request to implement comment liking. You need to pass the comment'sidAs a parameter. Usually, this is done asynchronously through JavaScript to provide a smooth user experience.

Summary

commentListTags are an indispensable part of AnQi CMS content operation, helping you build an active and orderly comment interaction area on your website with its concise syntax and powerful functions.From basic comment display to complex pagination and hierarchical replies, to the submission and liking of comments, Anqi CMS provides clear implementation paths, allowing your content to truly resonate with users.

Common Questions (FAQ)

1. How to ensure the quality of comment content and prevent spam?

Auto CMS provides comment moderation and captcha features to help you manage the quality of comments. You can determine whether a comment has been approved by checking theStatusfield in the comment data.Status = 1Represents through). In the template, you can base onStatusThe field determines whether to directly display comments or show the prompt "Content is being reviewedtag-/anqiapi-other/167.htmlDocuments), it can effectively prevent automated spam comments.

2. Can I display reply comments in the comment list to form a conversation thread?

Of course you can.commentListEach comment returned by the label contains aParentfield. If the current comment is a reply to another comment,ParentThe field will include the complete data of its parent comment. You can check it in the template loop.item.Parentwhether it exists, if it exists, then it can be nested or referenced (such as)<blockquote>）的方式显示上级评论的信息，从而创建出直观的对话串效果。评论提交时，表单中的parent_id字段是实现回复功能的基础。

How to adjust the display quantity or sorting of the comment list?

You can usecommentListTagslimitandorderParameters can be used to flexibly adjust the display quantity and sorting method. For example,limit="15"each time will display 15 comments,order="id desc"Comments will be sorted in reverse order by comment ID, which usually means that the most recently posted comments will be displayed at the top.If you need more complex sorting, such as sorting by likes, you may need to refer to more documents or carry out secondary development.