In website operation, when we toil hard to create an article, naturally, we hope that it can be seen by more readers and guide them to explore more wonderful 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, providing extremely convenient and powerful tags to help us easily achieve this goal.
Smart usearchiveListTag to get related articles
In AnQi CMS, to obtain and display a list of recommended articles related to the current article, we mainly usearchiveListThe tag 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 template of the article details page (usuallydetail.htmlUsed inarchiveListtags and settype="related"When the property is set, the AnQi CMS will work intelligently. It will automatically select the most similar articles in the same category based on the current article's category, content, publication time, and other factors, and display them as a recommendation list.This default smart 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 details page, the code will be 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 block,limit="5"We hope to recommend 5 articles in the list. You can adjust this number according to the page layout and requirements.item.LinkThe access link to the article will be automatically generated,item.TitleThe article title. To make the list richer, we also displayed a brief description of the article (item.Description) and the publication date (item.CreatedTimethrough.stampToDateFormatted).
Deep customization: Improve recommendation accuracy
In addition to the default intelligent recommendation, Anqi CMS also provides more refined control methods to meet specific operational needs.
1. Precision recommendation based on keyword association
To make the recommended content more accurately match the reader's interests, AnQi CMS allows us to associate recommendations through the keywords of the articles.When you edit articles in the background, the keywords you fill in come into play.archiveListlabel'slike="keywords"The attribute will indicate to the system to prioritize searching for articles that share the same keywords as the current article. It is worth noting that the system will default to the current article'sfirst keywordAs a basis for matching to find related content.
If you want the recommendation list to focus more on keyword matching, you can modify the code in this way:
{# 基于关键词的推荐 #}
<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>
Bylike="keywords"The system will try to find other articles related to the current article's keywords, thus providing more focused recommendations.
2. Manually associate with selected recommended articles.
For some special cases, such as when you want to strongly recommend several specific articles or manually create a series of related special topics, AnQi CMS also provides a flexible solution.On the article backend editing interface, there is a "related documents" setting item, where you can manually associate other articles.Once set, you can pass through in the templatelike="relation"This attribute is used to call these manually specified associated articles.
This way, the operator has absolute control, 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"Ensure that only the articles you manually associate in the background will be displayed. If an article is not manually associated, the list may not display content.
Combine images to make the recommendation list more attractive
A good recommendation list, besides the text title, adding eye-catching thumbnails will greatly increase the click-through rate. You can easily integrate article thumbnails into the recommendation list:
"twig {# Combine image and more information recommendation list #}"