如何在AnQiCMS中配置文章的推荐属性（如头条、幻灯），并在前端不同区域显示？
在安企CMS中管理网站内容，并让重要信息在用户眼前一亮，是提升用户体验和内容营销效果的关键。其中，文章的推荐属性配置和前端展示，就是实现这一目标的重要功能。通过合理设置，你可以轻松地将“头条”、“幻灯”这类文章显示在网站的不同位置，吸引访客目光。
第一部分：在后台为文章设置推荐属性
首先，我们需要进入安企CMS的后台管理界面，为特定的文章赋予“推荐属性”。
你可以在左侧导航栏找到“内容管理”，然后选择“发布文档”或“文档管理”来编辑已有的文章。进入文章的编辑页面后，你会看到一系列设置选项。其中，有一个名为“推荐属性”的区域。
安企CMS提供了八种预设的推荐属性，每种属性都用一个字母代码标识，方便你在前端模板中精确调用：
- 头条 [h]：通常用于网站最显眼的位置，如首页顶部的大标题文章。
- 推荐 [c]：适用于常规推荐位，如侧边栏、文章列表中的推荐。
- 幻灯 [f]：专为轮播图设计，适合在首页或特定页面以图片幻灯片形式展示。
- 特荐 [a]：表示特别推荐，重要性可能介于头条和普通推荐之间。
- 滚动 [s]：适用于新闻滚动条或公告栏，内容会以滚动形式展现。
- 加粗 [b]：文章标题在列表中会以加粗样式显示，起到强调作用。
- 图片 [p]：表示文章含有重要图片，可能需要特殊的图片展示样式。
- 跳转 [j]：如果点击文章需要跳转到外部链接而非文章详情页，可以使用此属性。
在为文章设置推荐属性时，你可以根据文章的重要性及其适合的展示方式，选择一个或多个属性。例如，一篇非常重要的文章，你可能希望它既在首页以幻灯片形式展示，又在其他地方作为推荐文章出现，这时就可以同时勾选“幻灯 [f]”和“推荐 [c]”。选择完毕后，别忘了保存文章，这样推荐属性就生效了。
第二部分：在前端模板中调用并显示推荐文章
接下来，我们将了解如何在网站的前端模板中，根据这些推荐属性来调用和显示文章。安企CMS的模板标签系统让这一过程变得非常直观。我们主要会用到 archiveList 标签来获取文章列表，并通过 flag 参数指定要调用的推荐属性。
你需要编辑网站的模板文件，这些文件通常位于 /template 目录下你当前使用的主题文件夹中。如果你不确定如何编辑模板，可以先在后台的“模板设计”功能中尝试在线编辑，或者查阅“模板制作”相关的帮助文档。
这里有一些在不同前端区域显示推荐文章的常见场景和代码示例：
1. 在首页顶部展示“头条”文章
首页的头条区域通常只有一篇文章，要求最醒目。你可以这样来调用设置了“头条 [h]”属性的文章：
{# 假设这是你的首页模板文件，例如 index/index.html #}
<div class="main-headline">
{% archiveList headlines with type="list" flag="h" limit="1" order="id desc" %}
{% for item in headlines %}
<a href="{{ item.Link }}" class="headline-link">
<img src="{{ item.Logo }}" alt="{{ item.Title }}" class="headline-image">
<h1 class="headline-title">{{ item.Title }}</h1>
<p class="headline-description">{{ item.Description }}</p>
</a>
{% empty %}
<p>暂无头条文章。</p>
{% endfor %}
{% endarchiveList %}
</div>
这里，我们使用 flag="h" 来指定头条文章，limit="1" 限制只显示一篇，order="id desc" 则确保显示最新发布的头条文章。item.Logo 会自动获取文章的封面首图。
2. 在幻灯片区域显示“幻灯”文章
网站的轮播图区域常常需要多篇文章以图片加标题的形式循环展示。对于设置了“幻灯 [f]”属性的文章，你可以这样调用：
{# 幻灯片区域的HTML结构，通常会配合JavaScript轮播库使用 #}
<div class="carousel-container">
<div class="swiper-wrapper">
{% archiveList slides with type="list" flag="f" limit="5" order="sort desc" %}
{% for item in slides %}
<div class="swiper-slide">
<a href="{{ item.Link }}">
<img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="slide-image">
<div class="slide-caption">
<h3>{{ item.Title }}</h3>
</div>
</a>
</div>
{% empty %}
<p>暂无幻灯片文章。</p>
{% endfor %}
{% endarchiveList %}
</div>
{# 其他轮播导航/分页器元素 #}
</div>
在这里，flag="f" 筛选出幻灯文章，limit="5" 获取最多五篇，order="sort desc" 则会按照你在后台设置的文章排序优先级来显示。item.Thumb 会自动获取文章的缩略图。
3. 在侧边栏显示“推荐”文章
侧边栏通常用于展示一些热门或精选文章。设置了“推荐 [c]”的文章是理想的选择：
{# 侧边栏推荐模块 #}
<div class="sidebar-module recommended-articles">
<h2>推荐阅读</h2>
<ul>
{% archiveList recommended with type="list" flag="c" limit="10" order="views desc" %}
{% for item in recommended %}
<li>
<a href="{{ item.Link }}">{{ item.Title }}</a>
<span>({{ item.Views }} 阅读)</span>
</li>
{% empty %}
<li>暂无推荐文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
</div>
这里我们使用 flag="c" 来获取推荐文章，limit="10" 显示十篇，而 order="views desc" 使得浏览量最高的文章优先显示，非常适合“热门推荐”场景。
4. 在文章列表中对特定文章标题进行“加粗”显示
如果你希望在常规的文章列表中，某些重要文章的标题能够突出显示，可以利用“加粗 [b]”属性。不过需要注意的是，flag 参数在 archiveList 中每次只能指定一个属性。如果要在 同一个 列表中显示所有文章，并且让带有“加粗”属性的文章标题加粗，你不能直接在 archiveList 中用 flag="b" 来筛选（因为它只会显示加粗文章）。
更灵活的做法是，先获取文章列表，然后在循环中判断每篇文章是否带有“加粗”属性。这需要 showFlag=true 参数来让 item.Flag 字段可用：
{# 常规文章列表，同时加粗显示特殊文章 #}
<ul class="article-list">
{% archiveList articles with type="page" limit="15" showFlag=true %}
{% for item in articles %}
<li>
{# item.Flag 是一个字符串，包含所有设置的flag字母，例如 "hc" #}
<a href="{{ item.Link }}" class="{% if item.Flag|contain:"b" %}font-bold{% endif %}">
{{ item.Title }}
</a>
<span> - {{ stampToDate(item.CreatedTime, "2006-01-02") }}</span>
</li>
{% empty %}
<li>暂无文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
在这个例子中，showFlag=true 使得 item.Flag 字段包含文章的所有推荐属性（如 “hc”）。我们使用 contain 过滤器来判断 item.Flag 中是否包含字母 “b”，如果包含，则给链接添加 font-bold 类，实现加粗效果。
一些通用参数提示：
moduleId：如果你有多个内容模型（如文章、产品），