How to display the reading views of articles on the AnQiCMS article list or detail page?

In website content operation, the number of article views is an important indicator, which helps us understand the popularity of the content and the interests of users.AnQiCMS provides a convenient way for you to visually display this data on the article list page or detail page.

Understanding the page view mechanism of AnQiCMS

AnQiCMS is a fully functional content management system that built-in the mechanism of automatically recording the number of article views.Each time a user visits an article published by AnQiCMS, the system silently increments the view count of that article.This data can not only be overviewed and analyzed in modules such as "Traffic Statistics" or "Home Page" on the background management interface, but can also be easily retrieved through front-end template tags and displayed to the visitors.

Displaying page views on the front end not only provides users with a reference to understand which articles are more popular, thereby enhancing the credibility and attractiveness of the content, but also helps to encourage user interaction and create a community atmosphere.

Display the number of page views on the article detail page

We need to use the AnQiCMS template provided to display the page views of a single article on its detail pagearchiveDetailThe tag is used to retrieve detailed information about the current or specified article.

Specific operations:

1. Find the detail page template:Generally, the template file for the article detail page may be located intemplate/{您的模板目录}/archive/detail.htmlortemplate/{您的模板目录}/{模型table}/detail.html.

2. Insert tag:Insert the following template code at the position where you want to display the number of views:

   {# 假设这是文章详情页的某个位置，例如在文章标题下方或发布时间旁边 #}
   <div>
       发布时间：{{stampToDate(archive.CreatedTime, "2006-01-02")}}
       <span> • 浏览量：{% archiveDetail with name="Views" %} 次</span>
   </div>
   

   Or, if you want to assign the number of views to a variable before using it:

   {# 将浏览量赋值给名为 `articleViews` 的变量 #}
   {% archiveDetail articleViews with name="Views" %}
   <div>
       本文已被阅读 {{ articleViews }} 次
   </div>
   

Code explanation:

• {% archiveDetail with name="Views" %}This is the core tag that tells AnQiCMS to retrieve the current article (because no parameter is specifiedidortokenThe default is the article of the current page) ofViewsThe field value and output directly.
• {{stampToDate(archive.CreatedTime, "2006-01-02")}}This is a commonly used time formatting tag used to convert the article's creation timestamp to a readable date format.
• <span> • 浏览量：... 次</span>This section is used to add text descriptions and units to make the display more friendly.

This way, every time a user visits the detailed page of this article, they can see the real-time page view data.

Display page views on the article list page

On the article list page, such as the article module on the homepage, the category list page, or the Tag list page, the page views of each article are displayed, which can help users quickly identify popular content. Here we will usearchiveListThe tag, it is used to iterate and display the article list.

Specific operations:

1. Find the list page template:The list page template is usuallytemplate/{您的模板目录}/index/index.html(Home) ortemplate/{您的模板目录}/{模型table}/list.html(Category list) etc.

2. Insert a label in the loop:InarchiveListlabel'sforAccess within the loop,item.Viewsto get the browsing volume of each article.

   {% archiveList archives with type="list" limit="10" %}
       {% for item in archives %}
       <li class="article-item">
           <a href="{{item.Link}}" class="article-title">{{item.Title}}</a>
           <div class="article-meta">
               <span>发布日期：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
               <span> • 浏览量：{{item.Views}} 次</span>
           </div>
           <p class="article-description">{{item.Description}}</p>
       </li>
       {% empty %}
       <li class="no-content">当前没有文章。</li>
       {% endfor %}
   {% endarchiveList %}
   

   Code explanation:

• {% archiveList archives with type="list" limit="10" %}This tag is used to retrieve a list of articles and limit the display to 10. You can adjust it as needed.typefor exampletype="page"Used for pagination lists),limit(Display number),categoryId(Specify category) and other parameters.
• {% for item in archives %}This is a loop structure,itemThe variable represents a specific article in the list each time the loop runs.
• {{item.Views}}In the loop, throughitem.ViewsYou can access the current article's view count.
• {% empty %}If the article list is empty, then display<li>当前没有文章。</li>.

By using the above method, you can flexibly display the page views of each article on various article list pages.

Further optimize the display effect of page views.

To make the page view data more prominent and practical, you can consider the following optimizations:

• Add units and styles:When displaying the number of views, add units such as "Times Read" or "Views", and use CSS to adjust the font size, color, or icon to make it more attractive.
• Popular Articles Sorting:You can use the browsing volume data to create a 'Popular Articles' or 'Most Popular' module. Simply inarchiveListadd in theorder="views desc"parameters, you can sort and display articles by browsing volume from high to low.
• Cache Update:If you find that the page view data is not updated in time, please try to manually clear the system cache in the "Update Cache" function of the AnQiCMS backend to ensure that the latest data can be correctly loaded by the front-end.

Frequently Asked Questions (FAQ)

1. Are the browsing volume data statistics of AnQiCMS real-time and accurate?

AnQiCMS will record each page visit in real time.However, the number of page views displayed to the front-end may be affected by various factors, such as the website using CDN caching or browser local caching. These caching mechanisms may cause the data displayed on the front-end to be slightly delayed from the actual backend statistics.But on the whole, the browsing volume data statistics of AnQiCMS is reliable, enough to reflect the popularity trend and relative热度 of the article.

2. Can I manually modify or reset the reading volume of the article?

In most cases, AnQiCMS does not provide the function to directly modify or reset the article view count in the front-end template, which is to ensure the fairness and authenticity of data statistics.In the background management interface, the system usually does not provide the option to manually modify the number of page views, as the core purpose is to record the actual user behavior.It is recommended to keep the default automatic statistics mechanism to obtain the most accurate data.

3. Why is the page view tag configured on my page not displaying?

If the page view is not displayed on your page, please check the following points:

• Is the template code correct?Please verify the content you have insertedarchiveDetailoritem.ViewsLabel, ensure there are no spelling or grammatical errors.
• Does the article exist: Confirm that the article has been published and is accessible, and there is corresponding data on the backend view count.
• System cache:Try to log in to the AnQiCMS admin panel, click the "Update Cache" feature, clear all system caches and refresh the page again.
• Does the article have actual access:Make sure you have visited the article or other users have visited, the views will start to accumulate. For newly published articles, the default number of views is 0 when no one accesses them.