In AnQiCMS, the home page of the website is often the first window visitors use to understand the content of the site.How to efficiently and dynamically display the latest articles to attract visitors to continue browsing is the key to content operation.archiveListTags are the core tools to achieve this goal.
UnderstandingarchiveListThe core function of the tag
archiveListLabels are a powerful tool in the AnQiCMS template system, allowing you to dynamically call lists of articles (or other content models, such as products) at any location on the website. Whether you need to display the latest published articles, the most viewed articles, or content under specific categories,archiveListIt can be achieved through simple parameter configuration.
To display the latest article list on the homepage, we will mainly focus onarchiveListand several key parameters:
type: This parameter determines the type of the list. For a regular content list, we usually set it to"list", indicating that only the specified number of contents will be displayed without generating pagination.orderIt defines the sorting method of the article. To display the 'latest' articles, we will sort them in reverse order by publication time or ID. In AnQiCMS,"id desc"(Sorted by ID in descending order) or"CreatedTime desc"(Sorted by creation time in descending order) is a common choice.limit: This parameter is used to control the number of articles displayed, for example"10"means displaying the latest 10 articles.moduleId: If your website has multiple content models (such as articles, products, etc.), you canmoduleIdParameters specify to only display articles of specific models, avoiding product information in the article list. By default, the ID of the article model is usually1.
Displaying the latest article list on the AnQiCMS homepage in actual operation
Now, let's look step by step on how to display the latest articles in your AnQiCMS homepage template.
Step 1: Determine your homepage template file
In AnQiCMS, the template file for the homepage is usually located in your theme directory underindex/index.htmlor it can be directlyindex.html. You need to go to the "Template Design" feature in the backend, find and edit this file.
Step 2: InsertarchiveListtags
After determining the location where the latest articles will be displayed on the homepage, you can insertarchiveList. This tag will define a variable, for example, we name itarchivesUsed to store the list of article data obtained.
{% archiveList archives with type="list" order="id desc" limit="10" %}
{# 接下来在这里循环展示文章内容 #}
{% endarchiveList %}
In this code block:
archivesIs the custom variable name we use, which will be used to access the data of each article later.type="list"We expect to get a simple list of articles.order="id desc"Tell the system to sort the articles by article ID from largest to smallest, as the new articles usually have larger IDs, this can effectively retrieve the latest articles.limit="10"It then specifies to only display the latest 10 articles.- If you only want to display the content under the 'Article Model', you can add
moduleId="1"(Assuming your article model ID is 1), this can more accurately control the type of content displayed.
Step 3: Loop to display article information
archiveListAfter obtaining the article list, you need to useforin a loop to iterate overarchivesvariables, and extract specific information from each article to display.
{% archiveList archives with type="list" order="id desc" limit="10" %}
<ul>
{% for item in archives %}
<li>
<h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
<p>{{ item.Description|truncatechars:100 }}</p> {# 截取前100个字符作为简介 #}
<div>
<span>发布日期: {{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
<span>阅读量: {{ item.Views }}</span>
{% if item.Thumb %}
<img src="{{ item.Thumb }}" alt="{{ item.Title }}" style="width: 100px; height: auto;">
{% endif %}
</div>
</li>
{% empty %}
<li>目前还没有最新文章哦，敬请期待！</li>
{% endfor %}
</ul>
{% endarchiveList %}
In this code block:
{% for item in archives %}The loop will process each of the latest articles one by one.itemIt represents the current article in each iteration.{{ item.Link }}and{{ item.Title }}It will retrieve the link and title of the article.{{ item.Description|truncatechars:100 }}It will get the description of the article and usetruncatecharsThe filter truncates it to the first 100 characters to prevent content from being too long and affecting the layout.{{ stampToDate(item.CreatedTime, "2006-01-02") }}It is a very practical time formatting function in AnQiCMS.item.CreatedTimeIs the timestamp of the article creation, through"2006-01-02"This Go language style date format, you can display it as a common "year-month-day" format.{{ item.Views }}It shows the page views of the article.{% if item.Thumb %}Check if the article has a thumbnail and according toitem.Thumbdisplay.{% empty %}Block is a very friendly design. Ifarchivesthere are no articles in the list, it will display{% empty %}The content behind, not empty, enhances user experience.
Optimization and tips
- Flexibility in date formatting:
stampToDateThe function is very flexible, you can adjust the second parameter according to your needs to display different date and time formats, for example"2006年01月02日 15:04"It will be displayed as “Year-Month-Day Hour:Minute”. - Description excerpt:
truncatecharsFilter (cuts by character) andtruncatewordsFilter (cuts by word) can help you control the length of the article summary and keep the homepage tidy. - Image processing:
item.ThumbIt usually points to a thumbnail automatically generated by the system, if you want to use the article's featured image or other images, you can tryitem.Logooritem.Images(Images is an array of images, which needs to be traversed in a loop). - SEO-friendly:The latest article list helps search engine spiders discover new content, combined with the built-in SEO features of AnQiCMS, it can further improve the inclusion efficiency and ranking of new articles.
You can elegantly display the latest article list on the AnQiCMS homepage by following these steps.AnQiCMS's template tag design makes content display both intuitive and efficient, allowing you to focus on content creation and operation.
Common Questions (FAQ)
1. I want to display more of the latest articles on the homepage, which parameter should I modify?
You need to adjust to display more of the latest articlesarchiveListthe tag inlimitParameters. For example, if you want to display 15 articles, you shouldlimit="10"Change tolimit="15".
2. How can I display the latest articles under a specific category?
If you only want to display the latest articles under a specific category,archiveListtag.categoryIdEnglish. You need to find the ID of the category first in the background (usually visible in the URL of the category management page or the edit page), and then use it like this: {% archiveList archives with type="list" order="id desc" limit="10" categoryId="你的分类ID" %}.
3. Why does the latest article list not display any content on the homepage even though I have configured it?
There may be several reasons why the homepage does not display any content:
- No articles to display:Check if your backend has published the article and the article status is 'Published'.
moduleIdConfiguration error:If you have usedmoduleId, please confirm that its value corresponds correctly to the article content model.limitororderQuestion:ChecklimitIs the value reasonable,orderAre the parameters correct (such as"id desc").- Template file not saved or cache problem:Make sure the template file is saved, and try to clear the system cache of AnQiCMS.
- Loop internal error:Check
forIs there a syntax error in the code inside the loop, causing it not to render normally? You can try to simplify it.forCheck the code inside the loop step by step.