In website operation, we all hope to display the most popular and highly read articles to visitors, such as common 'Hot Articles' or 'Most Viewed' lists.This not only effectively guides users to discover more exciting content and enhance the user experience of the website, but it is also an indispensable part of content operation.archive/listoforderin the parameters.

use cleverlyorderParameters, create your popular content list

AnQi CMS provides a powerful and flexible document list interface/api/archive/listIt allows us to filter and sort articles based on various conditions. Among them,orderThe parameter is the core to implement the 'Hot Articles' or 'Most Viewed' list.

In simple terms,orderThe parameter is used to tell the system the rule you want the article list to be sorted by. For the "most viewed" function we want to implement, the most direct way is to use the article view countviewsField) is sorted in descending order. The Safe CMS system automatically counts the page views of each article, and we just need to specify the parameter to sort by this field.orderSpecify the parameter to sort by this field.

For example, if you want to get the article with the highest number of views, just setorderparameter settingsviews descHere,viewsrefers to the article's view count field, anddescThis indicates that the sorting is in descending order, that is, from high to low. As a result, the returned list of articles will be sorted from the most viewed to the least viewed.

Gradually implement the 'Hot Articles' list

Next, let's take a look at how to use a few simple steps, utilizingorderparameters to retrieve and display the popular articles on your website.

Step 1: Clarify your needs

Before building the request, we need to consider several questions:

  • Which module's articles do you want to retrieve (for example, news articles or product introductions)? This corresponds to:moduleIdParameter.
  • Is it necessary to limit popular articles to a specific category? This corresponds tocategoryIdParameter.
  • How many popular articles do you want to display on the page? This corresponds tolimitParameter.

Step 2: Construct the API request URL

With clear requirements, we can start building the API request URL. Assuming we want to retrieve the article module (moduleId=1）下，浏览量最高的10篇文章，request URL will be like this:

{域名地址}/api/archive/list?moduleId=1&limit=10&order=views desc

Remember to{域名地址}replace it with your actual website domain, for examplehttps://www.yourwebsite.com.

  • moduleId=1：This indicates to retrieve the document under the article model with ID 1.
  • limit=10：This indicates to retrieve only the first 10 articles.
  • order=views desc：This is the core, it tells the Anqi CMS to followviewsField (view count) sorted in descending order.

If you need to specify a category, such as articles with category ID 5, just add anothercategoryId=5:

{域名地址}/api/archive/list?moduleId=1&categoryId=5&limit=10&order=views desc

Third step: Handle returned data

After you send a GET request to this URL, the CMS will return a JSON formatted data. In a successful case, you will seecodeis 0,dataThe field contains a list of articles. Each article object includesid/title/views/linketc. detailed information.

You need to write code to parse this JSON response. For example, use JavaScript'sfetchoraxioslibrary to make requests, then iteratedataover the array to extract the article information you need.

Fourth step: Display on the page

For example, a simplified HTML structure may look like this:

<div class="hot-articles">
    <h3>热门文章</h3>
    <ul>
        <!-- 这里会通过JavaScript动态插入文章列表 -->
    </ul>
</div>

<script>
    fetch('/api/archive/list?moduleId=1&limit=10&order=views desc')
        .then(response => response.json())
        .then(data => {
            if (data.code === 0 && data.data) {
                const ul = document.querySelector('.hot-articles ul');
                data.data.forEach(article => {
                    const li = document.createElement('li');
                    const a = document.createElement('a');
                    a.href = article.link; // 文章详情页链接
                    a.textContent = article.title + ' (' + article.views + '浏览)'; // 文章标题和浏览量
                    li.appendChild(a);
                    ul.appendChild(li);
                });
            } else {
                console.error('获取热门文章失败:', data.msg);
            }
        })
        .catch(error => {
            console.error('请求热门文章出错:', error);
        });
</script>

This code will request popular article data and generate a list on the page that includes titles and view counts, with each title linking to the corresponding article detail page.

Advanced Techniques and Thoughts

  • Implementing “Latest Articles”：“If you want to display the list of “Latest Articles”, you can：“orderparameter tocreated_time descThis will sort the articles from the most recent to the oldest。“
  • Combined sorting：“}]AlthoughorderParameters are usually used for sorting a single field, but in some advanced scenarios, you may need to combine multiple conditions. For example, you can sort byviews descfirst, and then bycreated_time descThis requires backend interface support for multi-field sorting string, the document example of Anqi CMS is a single field, please refer to the latest API document when in use.
  • Performance optimization:For frequently requested lists, consider caching on the front end or through CDN to reduce server pressure and improve loading speed.
  • Front-end framework integration:If you use Vue, React and other front-end frameworks, you can integrate the above data acquisition and rendering logic into components to achieve more flexible and efficient display.

Through flexible use of the security CMSarchive/listin the interfaceorderParameters, you can easily add various sorted article lists to your website, whether it's 'Hot Articles', 'Latest Releases', or other custom sorting, you can handle it with ease.This convenience greatly enhances the display efficiency and user experience of website content, making your website more attractive.

Common Questions (FAQ)

Q1:orderParameters other thanviewsandcreated_timeWhat fields are supported for sorting? orderParameters support multiple built-in fields for sorting, common ones include:id(Article ID),views（Views）、category_id(Category ID),created_time(Creation Time)、updated_time（Update time）and so on. You can choose appropriate fields according to your needs, andasc(Ascending) ordesc(Descending) to sort.

Q2: If I want to define 'hot' not just based on views, but for example, sort by the number of comments, can I do that?According to the current documentation,orderthe parameter mainly supportsid/views/category_id/created_time/updated_timeThese fields. If you wish to sort by comment count,comment_countyou need to refer to the latest Anqi CMS API documentation to confirm,comment_countIs it already added to the sortable fields. If not supported, you can consider performing secondary data processing on the backend, or using a custom field to record the 'hot rating'.