`categoryDetail`标签如何获取并显示特定分类的名称、描述、Banner图和缩略图?

在AnQiCMS的模板制作中,我们经常需要获取并展示特定分类的详细信息,例如分类的名称、描述,甚至是预设的Banner图和缩略图。categoryDetail标签正是为此而生,它能帮助我们轻松地从数据库中提取这些数据,并在网站前端进行灵活展示。

理解 categoryDetail 标签的核心作用

categoryDetail标签的主要功能是获取单个分类的详细数据。无论您是想在分类列表页的某个分类项中显示其额外信息,还是在分类详情页获取当前分类的所有数据,这个标签都能派上用场。

它的基本使用形式通常是这样的: {% categoryDetail 变量名 with name="字段名" id="分类ID" %}

其中:

  • 变量名:这是一个可选参数。如果您为它指定了一个变量名(例如myCategory),那么该标签获取到的分类数据将会存储在这个变量中,您可以在后续的模板代码中使用{{myCategory.Title}}这样的方式来访问各项数据。如果不指定变量名,标签会直接输出name参数指定字段的值。
  • name:这是最关键的参数,用于指定您想要获取分类的哪个字段信息,比如Title(分类名称)、Description(分类描述)等。
  • id:同样是可选参数。当您在一个分类页面(如分类详情页或分类列表页)使用categoryDetail标签时,如果未指定id,它会自动识别当前页面的分类ID来获取数据。但如果您想获取其他特定ID的分类信息,就需要明确指定id="分类ID"
  • token:与id类似,您也可以通过分类的URL别名来指定要获取的分类,例如token="about-us"
  • siteId:如果您管理着多个站点,并通过后台的多站点管理功能创建了它们,可以使用siteId参数来指定从哪个站点获取分类数据。

获取并显示分类的名称和描述

分类的名称和描述是分类最基本的信息,也是搜索引擎优化(SEO)和用户体验的重要组成部分。

要获取分类名称,您可以使用name="Title"

{# 假设我们想获取ID为1的分类名称 #}
<div>分类名称:{% categoryDetail with name="Title" id="1" %}</div>

{# 或者在分类详情页获取当前分类名称 #}
<div>当前分类名称:{% categoryDetail with name="Title" %}</div>

{# 将分类名称存储到变量中 #}
{% categoryDetail currentCategoryTitle with name="Title" %}
<h1>{{ currentCategoryTitle }}</h1>

同样,要获取分类的描述,只需将name参数设置为Description

{# 获取ID为1的分类描述 #}
<p>分类描述:{% categoryDetail with name="Description" id="1" %}</p>

{# 获取当前分类描述并存储到变量 #}
{% categoryDetail currentCategoryDescription with name="Description" %}
<p>{{ currentCategoryDescription }}</p>

获取并显示分类的缩略图

在AnQiCMS中,分类的图片通常分为“大图”(Logo)和“缩略图”(Thumb)。您可以根据设计需求选择显示哪种图片。

要获取分类的大图(Logo),您可以使用name="Logo"

{# 获取ID为1的分类大图 #}
<img src="{% categoryDetail with name="Logo" id="1" %}" alt="{% categoryDetail with name="Title" id="1" %}"/>

{# 获取当前分类大图并存储到变量 #}
{% categoryDetail categoryLogo with name="Logo" %}
<div class="category-banner-image" style="background-image: url('{{ categoryLogo }}');"></div>

要获取分类的缩略图(Thumb),则使用name="Thumb"

{# 获取ID为1的分类缩略图 #}
<img src="{% categoryDetail with name="Thumb" id="1" %}" alt="{% categoryDetail with name="Title" id="1" %}"/>

{# 获取当前分类缩略图并存储到变量 #}
{% categoryDetail categoryThumb with name="Thumb" %}
<img src="{{ categoryThumb }}" alt="分类缩略图"/>

获取并显示分类的Banner图(组图)

分类的Banner图通常是一组图片,用于在分类页面的顶部进行轮播展示,AnQiCMS将其命名为Images。由于它可能包含多张图片,因此需要结合for循环来遍历显示。

要获取分类的Banner组图,您需要将Images指定给一个变量,然后进行循环:

{# 获取当前分类的Banner组图,并存储到categoryImages变量中 #}
{% categoryDetail categoryImages with name="Images" %}

{# 检查是否存在图片,然后循环展示 #}
{% if categoryImages %}
<div class="category-slider">
    {% for image in categoryImages %}
    <img src="{{ image }}" alt="分类Banner图"/>
    {% endfor %}
</div>
{% endif %}

如果您的设计只需要Banner组图中的第一张作为分类头图,可以这样处理:

{% categoryDetail bannerImages with name="Images" %}
{% if bannerImages %}
  {# 将组图的第一张图片赋值给pageBanner变量 #}
  {% set pageBanner = bannerImages[0] %}
  <img src="{{ pageBanner }}" alt="分类头图"/>
{% else %}
  {# 如果没有Banner图,可以显示一个默认图片 #}
  <img src="/static/images/default_banner.jpg" alt="默认Banner"/>
{% endif %}

其他实用字段的获取

除了上述常用字段外,categoryDetail标签还能获取更多分类相关的信息,提升模板的灵活性和丰富度:

  • 分类内容 (Content):如果您在后台为分类填写了富文本内容,可以使用name="Content"获取。需要注意的是,如果内容包含HTML标签,通常需要配合|safe过滤器安全输出,且若后台开启了Markdown编辑器,内容会自动转为HTML。
  • 分类链接 (Link):通过name="Link"可以直接获取分类的访问URL,方便构建导航和链接。
  • 文档数量 (ArchiveCount):使用name="ArchiveCount"可以获取该分类下包含的文档总数,常用于显示“共X篇文章”。
  • 上级分类ID (ParentId):通过name="ParentId"获取,可以帮助您在模板中构建更复杂的层级关系判断。
  • 自定义字段:如果您的内容模型为分类设置了额外的自定义字段(例如“分类图标”、“自定义横幅描述”等),您也可以直接将这些字段名作为name参数的值来获取。例如,如果您有一个名为“自定义横幅描述”的自定义字段,则可以通过{% categoryDetail with name="自定义横幅描述" %}来获取。

通过categoryDetail标签,您可以轻松地将后台配置的分类信息呈现在用户面前,打造功能丰富、信息详尽的网站界面。


常见问题解答 (FAQ)

  1. 问:categoryDetail 标签是否会自动获取当前页面的分类信息? 答:是的,当您在任何分类详情页或分类列表页使用categoryDetail标签时,如果未明确指定idtoken参数,它会智能地识别并获取当前页面的分类数据,从而简化您的模板代码。

  2. 问:我想获取某个分类的Banner组图,但我的设计只需要显示第一张图作为分类头图,应该怎么操作? 答:您可以先通过{% categoryDetail bannerImages with name="Images" %}将Banner组图获取到一个变量bannerImages中。由于bannerImages是一个数组,您可以通过{% if bannerImages %}{% set pageBanner = bannerImages[0] %}{% endif %}这样的方式,将数组中的第一个元素(即第一张图片)赋值给一个新变量pageBanner。之后,您就可以直接使用{{ pageBanner }}来显示第一张图了。

  3. 问:如果我在AnQiCMS后台为分类添加了名为“分类图标”的自定义字段,我应该如何通过categoryDetail标签获取并显示它? 答:AnQiCMS会将您为分类自定义的字段直接作为name参数的可用值。因此,您可以直接使用{% categoryDetail with name="分类图标" %}来获取该自定义字段的值。如果该字段存储的是图片URL,您可以用<img>标签包裹起来显示。