在安企CMS中管理和展示网站内容,categoryDetail标签扮演着一个至关重要的角色。它就像您网站内容展示的指挥家,能够精准地获取并呈现特定分类的所有详细信息,无论是分类的标题、描述、缩略图,还是更深层次的关联内容,它都能助您一臂之力。
categoryDetail标签的核心作用
简单来说,categoryDetail标签的使命就是获取单个分类的详细数据。在分类页面,它会自动识别当前页面的分类信息并加载,但在其他页面,您也可以通过明确指定分类ID或URL别名来获取任意分类的数据。这在构建导航菜单、相关分类推荐或多层级内容展示时显得尤为灵活。
要使用这个标签,您通常会看到这样的形式:{% categoryDetail 变量名称 with name="字段名称" id="1" %}。其中,变量名称是可选的,如果您定义了它,后续就可以通过这个变量来引用获取到的数据;如果省略,标签将直接输出结果。id参数用于指定分类的数字ID,而token参数则允许您使用分类的URL别名来定位。对于部署了多站点的用户,siteId参数则能帮助您跨站点调用分类数据。
获取和展示分类的基本信息
分类的标题(Title)和描述(Description)是最基础也最常用的信息。它们不仅能让访问者快速了解分类主题,也是搜索引擎优化(SEO)的关键元素。例如,您可以通过{% categoryDetail with name="Title" %}直接在页面上显示分类标题,或者将其赋值给一个变量:{% categoryDetail categoryTitle with name="Title" %}{{categoryTitle}}。分类描述的获取方式与标题类似,通常用于在分类列表页提供简短概括,或填充HTML页面的<meta name="description">标签。
有时,分类页面本身可能包含一段详细内容(Content),这在某些专题分类或介绍性分类中很常见。categoryDetail标签同样能获取这部分内容。值得注意的是,如果分类内容是在后台的Markdown编辑器中编辑的,您可能需要使用render=true参数来确保Markdown语法能被正确解析并渲染为HTML,同时结合|safe过滤器以防止HTML代码被转义:{{categoryContent|render|safe}}。
灵活展示分类的视觉元素:缩略图与Banner
视觉内容在吸引用户方面至关重要,categoryDetail标签提供了多种方式来展示分类的图片信息。
缩略图:分类通常会有用于列表展示的图片。Logo字段通常代表分类的“缩略图大图”,而Thumb字段则可能代表经过裁剪或处理的“缩略图”。这两者都直接返回图片URL,您可以将它们嵌入<img>标签的src属性中。
Banner组图:对于一些需要轮播图或多图展示的分类,Images字段就派上用场了。它返回的是一个图片URL的数组。这意味着您需要通过一个for循环来遍历并显示这些图片,例如:
{% categoryDetail categoryImages with name="Images" %}
<ul>
{% for item in categoryImages %}
<li>
<img src="{{item}}" alt="{% categoryDetail with name="Title" %}" />
</li>
{% endfor %}
</ul>
如果只需要获取其中第一张图片作为页面背景或封面,可以通过数组索引访问:{% set pageBanner = categoryImages[0] %}。
自定义字段的展示
安企CMS的灵活内容模型允许您为分类添加各种自定义字段。这些字段可能包括联系方式、特定属性值、外部链接等。categoryDetail标签同样能获取这些自定义字段。
如果您想遍历显示所有自定义字段,可以通过获取Extra字段,然后在其内部循环:
{% categoryDetail extras with name="Extra" %}
{% for field in extras %}
<div>{{field.Name}}:{{field.Value}}</div>
{% endfor %}
若您只想获取某个特定的自定义字段,比如您在后台定义了一个名为categorySlogan的字段,可以直接通过名称获取:{% categoryDetail with name="categorySlogan" %}。
获取分类的关联内容
分类详情页除了展示分类自身的信息外,最重要的往往是展示该分类下的关联内容,比如文章列表或产品列表。categoryDetail标签本身并不直接返回这些内容,但它提供了关键的Id(分类ID),您可以利用这个ID配合archiveList标签来获取。
archiveList标签专门用于获取文档(文章、产品等)列表。在分类详情页中,您可以这样使用它来获取当前分类下的所有文档:
{% archiveList archives with categoryId=category.Id type="page" limit="10" %}
{% for item in archives %}
<li>
<a href="{{item.Link}}">
<h5>{{item.Title}}</h5>
<p>{{item.Description}}</p>
<img src="{{item.Thumb}}" alt="{{item.Title}}" />
</a>
</li>
{% empty %}
<li>此分类下暂无内容。</li>
{% endfor %}
{% endarchiveList %}
这里,categoryId=category.Id就是关键所在,它将categoryDetail获取的当前分类ID传递给了archiveList,确保只显示该分类下的文档。type="page"表示启用分页功能,而limit="10"则控制每页显示的文章数量。
综合示例
假设您正在为一个博客网站构建分类页,需要显示分类名称、描述、一张Banner图,以及该分类下的最新文章列表。您的模板代码可能会是这样:
{% categoryDetail category %} {# 获取当前分类所有信息,并赋值给category变量 #}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>{{ category.Title }} - 我的博客</title>
<meta name="description" content="{{ category.Description }}">
<link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
<header>
<h1>{{ category.Title }}</h1>
<p>{{ category.Description }}</p>
</header>
<div class="category-banner">
{% categoryDetail categoryBanner with name="Images" %}
{% if categoryBanner %}
<img src="{{ categoryBanner[0] }}" alt="{{ category.Title }}的封面图">
{% endif %}
</div>
<main class="category-content">
{% if category.Content %}
<div class="intro-content">
{{ category.Content|render|safe }}
</div>
{% endif %}
<h2>{{ category.Title }}下的最新文章</h2>
<ul class="article-list">
{% archiveList articles with categoryId=category.Id type="page" limit="10" order="CreatedTime desc" %}
{% for article in articles %}
<li>
<a href="{{ article.Link }}">
<img src="{{ article.Thumb }}" alt="{{ article.Title }}">
<h3>{{ article.Title }}</h3>
<p>{{ article.Description }}</p>
<span>发布日期:{{ stampToDate(article.CreatedTime, "2006-01-02") }}</span>
</a>
</li>
{% empty %}
<li>此分类下暂无文章。</li>
{% endfor %}
{% endarchiveList %}
</ul>
<div class="pagination-area">
{% pagination pages with show="5" %}
{% for p in pages.Pages %}
<a href="{{ p.Link }}" class="{% if p.IsCurrent %}active{% endif %}">{{ p.Name }}</a>
{% endfor %}
{% endpagination %}
</div>
</main>
<footer>
<p>© 2023 我的博客</p>
</footer>
</body>
</html>
通过categoryDetail标签,您可以轻松构建内容丰富、结构清晰的分类页面,为用户提供更好的浏览体验,同时也为搜索引擎优化奠定坚实基础。
常见问题 (FAQ)
categoryDetail和categoryList标签有什么区别?categoryDetail标签用于获取并展示单个分类的所有详细信息,比如某个特定分类的标题、描述、专属图片等。而categoryList标签则用于获取多个分类组成的列表,常用于构建导航菜单或侧边栏分类列表,它通常只返回分类的简要信息(如标题和链接),如果需要每个列表项的详细信息,可能需要在categoryList的循环内部再嵌套categoryDetail。**我通过
categoryDetail获取了分类内容(`