How to get and display a list of recommended articles related to the current article?

In website operation, when we toil hard to create an article, we naturally hope that it can be seen by more readers and guide them to explore more exciting content.On the bottom or sidebar of the article detail page, cleverly display recommended content related to the current article, which can not only significantly improve the depth and duration of user reading, but also bring many benefits to search engine optimization (SEO).AnQiCMS (AnQiCMS) fully understands this need and provides extremely convenient and powerful tags to help us easily achieve this goal.

Smart usearchiveListRetrieve related articles by tag

In the Auto CMS, to retrieve and display the list of recommended articles related to the current article, we mainly usearchiveListLabel. This label is the core tool we use to call various article lists in the template, and it has a special attributetype="related"It is designed to achieve article recommendation.

When we are in the article detail page template (usuallydetail.html) usedarchiveListLabel and settype="related"When the property is set, the CMS will work intelligently.It will automatically select the closest or most similar articles in the same category as the current article based on the article's category, content, publication time, and other factors, and display them as a recommended list.This default intelligent recommendation method saves us a lot of trouble in manual selection.

For example, you can add a "Related Recommendations" module at the bottom of the article detail page, and the code will look like this:

{# 在文章详情页的模板中，例如 detail.html #}
<div class="related-articles-section">
    <h3>相关推荐</h3>
    <ul>
    {% archiveList archives with type="related" limit="5" %}
        {% for item in archives %}
        <li>
            <a href="{{item.Link}}">{{item.Title}}</a>
            {# 还可以显示其他信息，例如发布时间、简介等 #}
            <p>{{item.Description|truncatechars:80}}</p>
            <span>发布于: {{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
        </li>
        {% endfor %}
    {% endarchiveList %}
    </ul>
</div>

In this code,limit="5"The list will display 5 articles as recommended. You can adjust this number according to the page layout and requirements.item.LinkThe access link to the article will be automatically generated,item.TitleEnglish is the article title. To make the list richer, we also show the brief description of the article (item.Description) and the publication date (item.CreatedTimeThroughstampToDateFormat).

Deep customization: Improve recommendation accuracy

In addition to the default smart recommendations, Anqi CMS also provides a more refined control method to meet specific operational needs.

1. Precise recommendations based on keyword association

archiveListTagslike="keywords"属性会指示系统，优先寻找那些与当前文章共享相同关键词的文章。值得注意的是，系统会默认以当前文章的EnglishThe first keywordAs a basis for matching, find related content.

If you want the recommendation list to be more focused on keyword matching, you can modify the code like this:

{# 基于关键词的推荐 #}
<div class="related-by-keywords">
    <h3>更多您可能感兴趣的</h3>
    <ul>
    {% archiveList archives with type="related" like="keywords" limit="5" %}
        {% for item in archives %}
        <li>
            <a href="{{item.Link}}">{{item.Title}}</a>
            <small>{{item.Keywords}}</small>
        </li>
        {% endfor %}
    {% endarchiveList %}
    </ul>
</div>

Passlike="keywords"The system will try to find other articles related to the current article's keywords to provide more focused recommendations.

2. Manually associate selected articles for recommended reading

like="relation"Properties can be used to call these manually specified associated articles.

This way, the operator has absolute control, and can accurately display recommended content based on content strategy or business needs:

{# 手动指定相关文章 #}
<div class="editor-picks">
    <h3>编辑精选</h3>
    <ul>
    {% archiveList archives with type="related" like="relation" limit="5" %}
        {% for item in archives %}
        <li>
            <a href="{{item.Link}}">{{item.Title}}</a>
            {# 您可以在这里添加更多描述，突出精选理由 #}
        </li>
        {% endfor %}
    {% endarchiveList %}
    </ul>
</div>

Here,like="relation"The article will only be displayed if you manually associate it in the background. If an article is not manually associated, the list may not display any content.

Combine with images, make the recommendation list more attractive

A good recommendation list, with eye-catching thumbnails along with text titles can significantly increase click-through rate. You can easily integrate article thumbnails into the recommendation list:

”`twig {# Combine image and more information recommendation list #}