如何在文章列表或详情页显示内容的推荐属性（如头条、推荐、幻灯）？
在安企CMS中，为了让您的网站内容更具吸引力，并且能够灵活地展示不同重要级别或展示形式的文章，系统提供了“推荐属性”功能。通过巧妙运用这些属性，您可以轻松地在文章列表或详情页上，为内容打上“头条”、“推荐”、“幻灯”等标签，从而引导用户关注，提升内容营销效果。
这篇指南将带您深入了解如何在AnQiCMS中设置和运用这些推荐属性，让您的网站内容管理更加得心应手。
一、理解推荐属性及其作用
首先，我们来认识一下这些推荐属性。在AnQiCMS的后台，当您添加或编辑文档时，会看到一个“推荐属性”的选项。这里列出了多种属性供您选择，例如：
- 头条 [h]: 通常用于网站首页最重要、最受关注的新闻或文章，吸引用户第一眼注意。
- 推荐 [c]: 标记为高质量、值得阅读的内容，常在侧边栏、相关推荐区域出现。
- 幻灯 [f]: 专为轮播图设计，带有此属性的文章通常会提取封面图，在大尺寸的图片展示区域循环播放。
- 特荐 [a]: 比“推荐”更进一步，通常是编辑精心挑选的深度内容。
- 滚动 [s]: 适用于通知、公告等需要在特定区域滚动展示的信息。
- 图片 [p]: 强调内容以图片为主，或者列表展示时需要特别突出图片。
- 跳转 [j]: 当点击文章时，不进入文章详情页，而是直接跳转到预设的外部链接，非常适合广告或引用外部资源。
这些属性的本质，是为您的内容打上不同类型的“标签”，方便您在前端页面根据需求进行筛选和展示。一个内容可以同时拥有多个推荐属性，例如，一篇新闻既可以是“头条”，也可以同时是“幻灯”，这意味着它既能在头条区域显示，也能作为轮播图的一部分。
二、在后台设置内容的推荐属性
设置推荐属性非常直观。当您登录AnQiCMS后台，进入“内容管理”模块，选择“添加文档”或编辑现有文档时，会看到“推荐属性”一栏。
您只需勾选相应的属性即可。例如，如果您希望一篇新发布的文章成为网站首页的头条新闻，同时也在轮播图中展示，那么您可以同时勾选“头条[h]”和“幻灯[f]”。系统会在您保存文章后，自动为这篇内容打上这些标记。
三、在文章列表页展示和筛选推荐属性内容
在网站的前端，文章列表页是展示内容的重要窗口。AnQiCMS提供了灵活的模板标签archiveList，让您可以根据推荐属性来筛选和显示内容。
1. 筛选指定推荐属性的列表
假设您想在首页的一个区域专门展示“头条”文章，或者在侧边栏显示“推荐”内容，您可以这样做：
{# 假设您想获取5篇头条文章 #}
<div class="headline-articles">
<h2>头条新闻</h2>
<ul>
{% archiveList archives with type="list" flag="h" limit="5" %}
{% for item in archives %}
<li>
<a href="{{item.Link}}">{{item.Title}}</a>
{# 这里可以根据需要添加发布时间、简介等信息 #}
<span>{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
</li>
{% empty %}
<li>目前没有头条文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
</div>
{# 假设您想在侧边栏展示3篇推荐文章 #}
<div class="recommended-articles">
<h3>推荐阅读</h3>
<ul>
{% archiveList recommendations with type="list" flag="c" limit="3" %}
{% for item in recommendations %}
<li><a href="{{item.Link}}">{{item.Title}}</a></li>
{% empty %}
<li>暂无推荐文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
</div>
在上面的代码中，flag="h"用于筛选带有“头条”属性的文章，而flag="c"则用于筛选带有“推荐”属性的文章。您只需将flag参数的值替换成对应的属性字母（如f代表幻灯，j代表跳转等），即可获取不同属性的文章列表。
2. 在列表项中直观显示推荐属性标记
除了筛选，您可能还希望在普通文章列表中，为带有特定推荐属性的文章添加一个醒目的小图标或文字标记，让用户一眼识别。这时候，我们需要在archiveList循环内部，利用item.Flag字段来判断。
item.Flag会返回一个字符串，包含了文章设置的所有推荐属性字母。我们可以使用contain过滤器来检查它是否包含特定的属性字母。
<div class="all-articles-with-badges">
<h2>全部文章</h2>
<ul>
{% archiveList articles with type="list" limit="10" showFlag=true %}
{% for item in articles %}
<li>
<a href="{{item.Link}}">
{% if item.Flag|contain:"h" %}
<span class="badge headline-badge">头条</span>
{% elif item.Flag|contain:"c" %}
<span class="badge recommended-badge">推荐</span>
{% elif item.Flag|contain:"f" %}
<span class="badge slideshow-badge">幻灯</span>
{% endif %}
{{item.Title}}
</a>
</li>
{% empty %}
<li>暂无文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
</div>
请注意，为了在列表项中获取 item.Flag，您需要在 archiveList 标签中添加 showFlag=true 参数。
通过这种方式，文章列表中的每个项目会根据其推荐属性，动态显示对应的标记，极大地提升了内容的可读性和视觉吸引力。当然，您还需要一些CSS样式来美化这些badge。
四、在文章详情页显示推荐属性标记
在文章详情页，您也可以根据当前文章的推荐属性，显示相应的标记或信息。这与列表页的逻辑类似，只是我们直接使用archive对象（代表当前文章）的Flag字段。
<article class="article-detail">
<h1>{{archive.Title}}</h1>
<div class="article-meta">
发布时间：{{stampToDate(archive.CreatedTime, "2006年01月02日")}}
{% if archive.Flag|contain:"h" %}
<span class="badge detail-headline">头条新闻</span>
{% endif %}
{% if archive.Flag|contain:"c" %}
<span class="badge detail-recommended">小编推荐</span>
{% endif %}
{% if archive.Flag|contain:"j" %}
<span class="badge detail-jump">（点击此文将跳转到外部链接）</span>
{% endif %}
{# 您可以在这里继续添加其他属性的判断 #}
</div>
<div class="article-content">
{{archive.Content|safe}}
</div>
</article>
这里，我们通过{{archive.Flag|contain:"h"}}来判断当前文章是否含有“头条”属性，并相应地展示“头条新闻”标记。这样，即便是进入了详情页，用户也能清晰地知道这篇内容的重要程度或特殊性。