When browsing articles on a website, navigation links such as 'Previous Article' and 'Next Article' often appear at the bottom.This seemingly simple detail actually has a significant impact on user experience and the coherence of website content.It can not only guide visitors to explore more content continuously, helping to improve the average visit duration of the page, but also optimize the internal link structure of the website.For friends using AnQiCMS, achieving this feature is much simpler than imagined, as it built-in powerful template tags, making it easy to dynamically obtain and display this navigation information.

核心功能介绍：动态获取相邻文章的秘密

The AnQi CMS provides high flexibility in template development, especially for content such as articles. It comes with two very practical tags:prevArchiveandnextArchive.These tags can intelligently identify the current article and automatically find the previous and next articles in the same category or time sequence.This means you do not need to manually maintain complex associations between articles; the system will do it automatically.

How to implement navigation to the previous/next article in the article detail page

To integrate the "Previous" and "Next" navigation functions into your corporate CMS website, you need to edit the template file of the article detail page. Usually, this template file will vary depending on your content model and naming conventions, for example, it may be located attemplate/您的模板名称/article/detail.htmlortemplate/您的模板名称/产品模型名称/detail.html.

Find and open the current article detail template file being used on your website. After that, you can add the following code snippet below the article content, in the sidebar, or at any position you think is most suitable for user reading habits:

<div class="article-navigation">
    <div class="prev-article">
        {% prevArchive prev %}
        {% if prev %}
        <span class="nav-label">上一篇：</span><a href="{{ prev.Link }}" title="{{ prev.Title }}">{{ prev.Title }}</a>
        {% else %}
        <span class="nav-label">上一篇：</span><span>没有了</span>
        {% endif %}
        {% endprevArchive %}
    </div>
    <div class="next-article">
        {% nextArchive next %}
        {% if next %}
        <span class="nav-label">下一篇：</span><a href="{{ next.Link }}" title="{{ next.Title }}">{{ next.Title }}</a>
        {% else %}
        <span class="nav-label">下一篇：</span><span>没有了</span>
        {% endif %}
        {% endnextArchive %}
    </div>
</div>

Code parsing and explanation:

  • {% prevArchive prev %}and{% endprevArchive %}:This is a special tag block used to retrieve information about the previous article. It will try to find the previous article in the context of the current article and assign all its data (including title, link, ID, etc.) to the one you define.preva variable.
  • {% nextArchive next %}and{% endnextArchive %}:WithprevArchiveThis tag block is used to get the information of the next article and assign all its datanexta variable.
  • {% if prev %}and{% if next %}:These conditions are crucial.Not all articles have a previous or next article (for example, the first article in a category does not have a previous one, and the last article does not have a next one).prevornextVariable whether the data has been successfully obtained.If the variable exists, display the corresponding title and link; if it does not exist, you can elegantly display 'None' or completely hide the navigation item.
  • {{ prev.Link }}and{{ prev.Title }}: prevandnextVariables essentially are article objects, they contain many properties of the articles. Here, we useLink(the URL link of the article) andTitle（Article title）to build navigation. You can also access other fields mentioned in the document, such asId(Article ID),Keywords/Description/Thumb（Thumbnail）etc., freely choose to display according to your design requirements.

Brief description of the working principle

When your website visitor clicks to enter an article detail page, the backend system of AnQi CMS will intelligently search for the previous and next article records adjacent to the current article based on the article ID, its category, publication time, or custom sorting in the backend.prevArchiveandnextArchiveThe label takes advantage of this efficient mechanism to directly pass the structured data (including article titles, links, and other key information) retrieved to the front-end template.This design eliminates the hassle of manually managing the complex associations between articles, making the navigation function automatic.

额外提示与**实践

  1. Confirm template file:Please make sure that the article detail template file you are editing is correct. If you have enabled a custom content model, then the path of the detail page template may followtemplate/您的模板名称/{模型table}/detail.htmlThe naming rules.
  2. The sorting logic of content.“Previous” and “Next” judgment logic is usually based on the order of the article's publication time, or the custom sorting set in the “Document Management” section of the Anqi CMS backend.If you find that the navigation order does not meet your expectations, it is recommended to check the publication date of the article and the sorting settings on the backend.
  3. Clear cache:After any modifications to the template file, in order to ensure that your changes take effect immediately and are displayed on the website frontend, please log in to the Anqi CMS backend and use the 'Clear Cache' feature to clean the website cache.

Through these concise steps, you can easily implement the navigation for the previous and next articles in the article detail page of the Anqi CMS, thereby significantly improving the user experience and navigation efficiency of the website.

Frequently Asked Questions (FAQ):

Q1: Why do 'Previous' or 'Next' still show as 'None' even though I followed the steps and there are adjacent articles?

A1：This situation may occur for several reasons.Firstly, please check if the article you are currently viewing is the first or last article in a category, which naturally leads to a missing navigation direction.The adjacent article's publishing status must not be "Not Published" or have abnormal publishing time (such as future time) for the system to correctly identify.Please check the publication date and status of the relevant articles to ensure they are all normal.Finally, after modifying the template file, please log in to the AnQi CMS backend, click the 'Update Cache' feature, and clear all website caches to ensure that the code update takes effect.

Q2:prevArchiveandnextArchiveWhat conditions are used to judge and obtain adjacent articles?

A2: These tags are usually judged intelligently based on the following conditions of the current article:

1.  **发布时间：** 默认情况下，系统会按照文章的发布时间戳进行排序，找到在时间轴上紧邻当前文章的前一篇和后一篇。
2.  **内容模型和分类：** 它们倾向于在与当前文章相同的内容模型和分类下查找相邻文章，以保持内容的关联性。
这意味着，如果您需要调整上一篇/下一篇的顺序，调整文章的发布时间或在后台进行自定义排序是有效的方法。

Q3: Can I display other article information in the 'Previous'/'Next' navigation, besides the title and link? For example, thumbnails?

A3: Of course you can.prevandnextThe variable actually contains the complete article object of the previous/next article, which means you can access many of its properties. BesidesTitleandLink, you can also getId(Article ID),Keywords/Description(article summary),Thumb(Thumbnail) Fields. For example, to display the thumbnail next to the previous article, you can modify the code like this:

auto

<span class="nav-