How to call and display the latest article list in AnQi CMS?

As a rich-featured and easy-to-use content management system, AnQi CMS provides great flexibility in content display.When you need to display the latest articles on your website to visitors, such as on the homepage, sidebar, or a specific topic page, Anqi CMS can help you easily achieve this requirement.

To implement the function of calling and displaying the latest article list in Anqi CMS, the key lies in flexibly using its powerful template tag system, especiallyarchiveListLabel. The Anqi CMS template engine is similar to Django, allowing you to call various data on the page using concise tag syntax.

UnderstandingarchiveListBasic usage of tags

archiveListThe tag is the core tag used by Anqi CMS to obtain article list data. Its basic structure is as follows:

{% archiveList archives with ... %}
    {% for item in archives %}
        {# 在这里显示每篇文章的具体信息 #}
    {% endfor %}
{% endarchiveList %}

Here, archivesIt is a variable name you define for the article list, and you can name it according to your preference.itemIt represents each article object in the loop, you can obtain the various properties of the article byitem.字段名.

Key parameters: How to get the "latest" article

To call and display the 'latest' articles, you need to pay attention toarchiveListSeveral key parameters of the tag:

  1. orderparameters:This is the core factor that determines the sorting method of the articles. To get the latest articles, you can setorderis set toid desc(Sorted by article ID in descending order, usually the larger the article ID, the later the release, that is, the newer) orCreatedTime desc(Sorted by article creation time in descending order). For example:order="id desc".
  2. limitparameters:Used to control the number of articles you want to display. If you want to display 5 of the latest articles on the page, you can setlimit="5".
  3. moduleIdparameters:The Anqi CMS supports multiple content models (such as articles, products, etc.).To ensure that only content of the article type is called, you need to specify the model ID of the article explicitly.1Therefore, it can be set tomoduleId="1".
  4. typeparameters:If you just want to display a simple article list without pagination, you cantypeis set tolist.

Display the article details

In{% for item in archives %}Access within the loop, you canitemVarious properties of the object are used to display the title, link, publication date, thumbnail, etc. of the article. Common properties include:

  • item.Title: Article title.
  • item.Link: Link to the article details page.
  • item.Description: Article summary.
  • item.CreatedTime: Article creation time (timestamp format, needs to be formatted).
  • item.Views: Article views.
  • item.Thumb: Article thumbnail address.
  • item.Logo: Article cover first image address.

ForCreatedTimeSuch a timestamp field, Anqi CMS provides a convenientstampToDatefunction to format the display. For example,{{stampToDate(item.CreatedTime, "2006-01-02")}}the timestamp will be formatted as a date in the format of “year-month-date”.

Actual operation example: Call and display 5 of the latest articles

Suppose you want to display 5 of the latest articles at a location on the website, including titles, publication dates, and article links, and display thumbnails if available. You can place the following code snippet in your AnQi CMS template file (for exampleindex.htmlorpartial/aside.htmlIn:

<div class="latest-articles-list">
    <h3>最新文章</h3>
    <ul>
        {% archiveList archives with moduleId="1" order="id desc" limit="5" type="list" %}
            {% for item in archives %}
                <li>
                    <a href="{{ item.Link }}">
                        {% if item.Thumb %}
                            <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="article-thumb">
                        {% else %}
                            {# 如果没有缩略图，可以显示一个默认图片或省略图片区域 #}
                            <img src="/public/static/images/default-thumb.webp" alt="默认缩略图" class="article-thumb">
                        {% endif %}
                        <div class="article-info">
                            <h4>{{ item.Title }}</h4>
                            <p class="article-date">{{ stampToDate(item.CreatedTime, "2006-01-02") }}</p>
                        </div>
                    </a>
                </li>
            {% empty %}
                <li>暂无最新文章。</li>
            {% endfor %}
        {% endarchiveList %}
    </ul>
</div>

Code analysis:

  • {% archiveList archives with moduleId="1" order="id desc" limit="5" type="list" %}:
    • archives:Store the list of articles retrieved to a namearchives.
    • moduleId="1":Specify the content under the article model (ID usually 1).
    • order="id desc"：In descending order by article ID, make sure to get the latest published article.
    • limit="5"：Limit to displaying only 5 articles.
    • type="list"：Get in list form, do not handle pagination.
  • {% for item in archives %}: Loop through.archivesEach article object in the variable.
  • {% if item.Thumb %}: Determine whether the current article has a thumbnail. If it does, then display it.
  • <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="article-thumb">: Display the thumbnail,altProperty helps SEO and user experience.
  • <h4>{{ item.Title }}</h4>Display article title.
  • <p class="article-date">{{ stampToDate(item.CreatedTime, "2006-01-02") }}</p>Format and display the article publish date.
  • {% empty %}: It is a very practical tag, whenarchivesIf the list is empty, it will display<li>暂无最新文章。</li>to avoid blank pages on the page.

By following these steps and example code, you can flexibly call and display the latest article list in Anqi CMS.The strength of AnQi CMS lies in its customizable template system, allowing you to freely combine and display content according to the actual needs of your website.

Frequently Asked Questions (FAQ)

1. How to display the latest articles under a specific category only?

You canarchiveListthe tag withcategoryIdSpecify the category ID. For example, to display articles of category ID10you can write like this:{% archiveList archives with moduleId="1" categoryId="10" order="id desc" limit="5" type="list" %}You can find the corresponding category ID in the "Content Management" -> "Document Category" in the background.

2. How to implement pagination for the latest article list?

If the latest article list is long, you may want to paginate. This requires thatarchiveListlabel'stypethe parameter topage，and cooperatepaginationLabel usage. For example:{% archiveList archives with moduleId="1" order="id desc" limit="10" type="page" %}(After the loop){% pagination pages with show="5" %}...{% endpagination %}Specific.paginationLabel usage, it is recommended to refer to the 'Template Tags and Usage Methods' document of Anqi CMS, which contains detailed pagination code examples.

3.order="id desc"andorder="CreatedTime desc"What is the difference when getting the latest articles?

order="id desc"It is sorted in descending order based on the unique identifier (ID) of the article in the database.In most cases, the article ID is incremental, so the larger the ID, the later the publication time, thus achieving the effect of obtaining the latest articles.order="CreatedTime desc"It is directly sorted in descending order according to the article creation time field.This is a more precise 'latest' definition in theory.In practice, both effects are often very similar. You can choose one based on personal preference or specific needs.CreatedTime desc.