In AnqiCMS, flexibly displaying website content is the key to improving user experience and meeting operational needs.Whether you want to highlight the latest articles on the homepage, display popular products in the sidebar, or customize content lists for specific columns, AnqiCMS' powerful document list tags can lend you a hand.By cleverly using these tags, you can easily achieve diverse content presentation, making your website more vibrant and attractive.
Core tags:archiveListThe strong points of
AnqiCMS's template system providesarchiveListThis core tag is the universal tool for you to obtain and display lists of various documents (articles, products, etc.).This tag can not only filter content based on multiple conditions, but also control the sorting method, display quantity, and even handle pagination logic.archiveListwhich will greatly enhance your freedom in website content layout.
Display the latest content: keep visitors informed of the latest dynamic
Do you want to display the latest articles or products in a prominent position on the website to attract user attention?archiveListThe sorting function of the tags can easily achieve this.Generally, we can sort the documents in descending order by the release time (i.e., ID) to ensure that the latest content is displayed at the top.
You can set it this way to get the latest list of articles:
{% archiveList latestArticles with moduleId="1" order="id desc" limit="5" %}
{% for item in latestArticles %}
<div class="article-item">
<a href="{{ item.Link }}">
<h3>{{ item.Title }}</h3>
<p>{{ item.Description|truncatechars:80 }}</p> {# 截取前80个字符并添加省略号 #}
<span>发布日期: {{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
</a>
</div>
{% endfor %}
{% endarchiveList %}
In this code block:
moduleId="1"Point out that we want to get the article model (if you want to display the latest products, you can change it to the corresponding product model ID).order="id desc"Tell the system to sort by ID in descending order, usually the larger the ID, the later the release time, thus achieving the "latest" effect.limit="5"Limit to show the latest 5 articles.stampToDate(item.CreatedTime, "2006-01-02")is a very useful time formatting function, which can convert timestamps into easily readable date formats.
Display popular content: Insight into user interests.
Understanding what content is popular and showcasing it is an effective strategy for improving website interaction rates.AnqiCMS records the page views for each document, and we can use this data to filter popular content.
You can display popular articles or products byorder="views desc"The parameters are sorted in descending order according to the number of views:
{% archiveList hotProducts with moduleId="2" order="views desc" limit="4" %}
{% for item in hotProducts %}
<div class="product-card">
<a href="{{ item.Link }}">
<img src="{{ item.Thumb }}" alt="{{ item.Title }}">
<h4>{{ item.Title }}</h4>
<p>浏览量: {{ item.Views }}</p>
</a>
</div>
{% endfor %}
{% endarchiveList %}
Here:
moduleId="2"Assuming 2 is the ID of the product model.order="views desc"The content is displayed in descending order of views, showing the most popular content.item.ThumbUsed to obtain the thumbnail of the product, making the list display more intuitive.
Displays content of a specified category: precisely定位 target audience
The website content is usually organized into different categories, such as "Company NewsarchiveListTags allow you to precisely specify which category or categories of content you want to display.
Assume you want to display articles under the 'Company News' category (category ID 3) on a page, you can do it like this:
{% archiveList companyNews with moduleId="1" categoryId="3" limit="6" %}
{% for item in companyNews %}
<div class="news-item">
<a href="{{ item.Link }}">
<h5>{{ item.Title }}</h5>
<p>{{ stampToDate(item.CreatedTime, "2006-01-02") }}</p>
</a>
</div>
{% endfor %}
{% endarchiveList %}
If you want to display articles from multiple categories at the same time (for example, category IDs 3 and 5), just separate the category IDs with commas: categoryId="3,5".
In addition,categoryIdThe parameter, when not specified, will default to the current page's category ID, which is very suitable for directly calling articles under the current category on the category list page. You can also add an option if you do not want to retrieve the content of subcategories.child=falseParameter.
Display recommended attribute content: highlight operation focus
AnqiCMS provides various recommended attributes (such as headline[h], recommendation[c], slideshow[f], etc.) to facilitate operators in marking important content. UtilizeflagParameter, you can easily extract this specially marked content for display.
For example, to display the articles marked as "slideshow" on the homepage as a carousel content:
{% archiveList slideshowArticles with moduleId="1" flag="f" limit="3" %}
{% for item in slideshowArticles %}
<div class="carousel-item">
<a href="{{ item.Link }}">
<img src="{{ item.Logo }}" alt="{{ item.Title }}">
<div class="carousel-caption">{{ item.Title }}</div>
</a>
</div>
{% endfor %}
{% endarchiveList %}
Hereflag="f"Ensure that only articles marked as “Slideshow” are displayed.item.LogoUsually used to get the first cover image, very suitable for carousel scenes.
More advanced applications and auxiliary tags
- Paging display:When the amount of content is large, combined
type="page"andpaginationLabels can implement elegant pagination functions to enhance user browsing experience.archiveListSet tagstype="page"After that, the system will automatically handle the pagination logic, then you can usepaginationLabels to render pagination navigation. - Tag content list:If you want to display relevant documents based on a tag (Tag),
tagDataListtags will be a more direct choice. It is similar toarchiveListin terms of usage, but focuses on tag ID. - Dynamic content model:AnqiCMS supports custom content models, which means you can create different content structures for various business needs. In using
archiveListit is essential to pass throughmoduleIdParameter specifies the content model you want to retrieve to ensure data accuracy. - Traverse the nested category list:with
categoryListTags, you can first display the categories in a loop, and then use them under each category.archiveListThe label displays articles under this category, achieving more complex navigation and content layout.
Through the above method, you can fully utilize the document list tags of AnqiCMS to flexibly and efficiently display your latest, popular, or specified category of articles and products on the front end.This can not only optimize the content structure of the website, but also better guide users to discover the information they are interested in.
Common Questions (FAQ)
1. How can I display the latest articles and the latest products on the homepage at the same time?You can use twoarchiveListtags to achieve this. The firstarchiveLista tag specificationmoduleId="1"(article model ID) andorder="id desc"to get the latest articles, the secondarchiveLista tag specificationmoduleId="2"(product model ID) andorder="id desc"Get the latest products. Both have no effect on each other and can be displayed side by side on the page.
2. Why does my article list only show 10 articles without pagination links?If you want the article list to have pagination functionality,archiveListthe tag must be settype="page"parameters. At the same time,archiveListafter the end of the tag,paginationyou need to use the tag to render the pagination navigation links. For example:{% archiveList archives with type="page" limit="10" %}...{% endarchiveList %}后面紧跟着{% pagination pages with show="5" %}...{% endpagination %}.
3. I want to display other articles under the current category of the article detail page, but I don't want to display the content of the subcategory, how should I do it?In the article detail page,archiveListThe label will default to getting the ID of the current article's category. To only display other articles in the current category (excluding subcategories), you canarchiveListthe tag to set explicitlycategoryId="{{ archive.CategoryId }}"(Here,archive.CategoryIdis the current article's category ID) andchild=falseFor example:{% archiveList relatedArticles with categoryId="{{ archive.CategoryId }}" child=false limit="5" %}.