如何在前台页面有效展示分类的描述（Description）和内容（Content）？

在安企CMS中，分类的描述（Description）和内容（Content）是网站内容组织和搜索引擎优化（SEO）的关键要素。有效地在前台页面展示这些信息，不仅能为访客提供清晰的导航和深入的信息，也能帮助搜索引擎更好地理解页面主题，从而提升网站的可见度。接下来，我们一起探讨如何在安企CMS的前台模板中灵活地展示分类的描述和内容。

一、理解分类描述与内容的价值

在安企CMS的后台，我们可以为每一个分类设置“分类简介”和“分类内容”。

• 分类简介（Description）：通常是一段简短的文字，用于概括该分类的主题。它在SEO中扮演重要角色，常被用作页面的Meta Description，也会在列表页中作为分类的摘要信息展示。简洁而富有吸引力的描述能有效提升点击率。
• 分类内容（Content）：则可以包含更详尽的文本、图片、视频等多媒体信息，用于深入介绍该分类所包含的主题。这对于用户深入了解某一领域或产品系列至关重要，也能为页面提供丰富的文本内容，增强SEO效果。

这些信息在后台的“内容管理” -> “文档分类”中进行编辑和管理。

二、在分类列表页展示描述（Description）

当我们需要在一个页面上列出多个分类，并显示它们的简短描述时，可以使用 categoryList 标签。这个标签常用于首页或栏目页，以展示当前页面下属的子分类或特定模型的分类。

例如，要在首页展示所有文章分类的标题和描述，可以在模板中使用如下代码：

{% categoryList categories with moduleId="1" parentId="0" %}
    <div class="category-list-wrapper">
        {% for item in categories %}
            <div class="category-item">
                <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
                {# 直接通过 item.Description 获取分类简介 #}
                <p class="category-description">{{ item.Description }}</p>
                <a href="{{ item.Link }}" class="read-more">查看更多</a>
            </div>
        {% endfor %}
    </div>
{% endcategoryList %}

在这段代码中，item 变量代表了 categoryList 循环中的每一个分类对象。通过 {{ item.Description }} 就可以直接访问并展示该分类的简介信息。通常，在列表页中，我们只会展示简短的描述，避免内容过长影响页面布局和加载速度。

三、在分类详情页展示描述（Description）和内容（Content）

在访客点击某个分类进入其详情页时，我们通常需要展示该分类的完整信息，包括其描述和详细内容。这时，categoryDetail 标签就派上用场了。这个标签专门用于获取当前页面的分类详细数据。

1. 展示分类描述（Description）

分类描述往往用于页面的顶部或关键位置，再次强调分类的核心信息：

<div class="category-header">
    <h1>{% categoryDetail with name="Title" %}</h1>
    <p class="category-page-description">
        {# 通过 categoryDetail 标签获取当前分类的描述 #}
        {% categoryDetail with name="Description" %}
    </p>
</div>

这里，{% categoryDetail with name="Description" %} 会直接输出当前分类的简介。

2. 展示分类内容（Content）

分类内容是提供给访客最详尽信息的部分。安企CMS的分类内容支持富文本编辑，也可能包含HTML代码甚至Markdown格式。因此，在前端展示时需要特别注意内容的解析和渲染。

• 处理HTML内容：如果分类内容是富文本编辑器编辑的HTML，为了确保HTML标签能正确渲染而不是作为纯文本显示，我们需要使用 |safe 过滤器。

  <div class="category-main-content">
      {# 使用 categoryDetail 获取分类内容，并通过 |safe 过滤器确保HTML正确渲染 #}
      {% categoryDetail categoryFullContent with name="Content" %}
      {{ categoryFullContent|safe }}
  </div>
  

  在这里，我们首先将分类内容赋值给 categoryFullContent 变量，然后使用 {{ categoryFullContent|safe }} 来安全地输出HTML内容。

• 处理Markdown内容：如果您的安企CMS后台启用了Markdown编辑器，并且分类内容是以Markdown格式编写的，那么在前端展示时需要先将其转换为HTML。安企CMS提供了两种方式：

  • 在标签中指定 render=true：

    
    <div class="category-main-content">
        {# 指定 render=true 让安企CMS自动将Markdown内容转换为HTML #}
        {% categoryDetail categoryMarkdownContent with name="Content" render=true %}
        {{ categoryMarkdownContent|safe }}
    </div>
    

  • 使用 |render 过滤器：如果您希望在模板中手动控制Markdown转换，或者内容来源不确定是否为Markdown，可以使用 |render 过滤器。

    
    <div class="category-main-content">
        {# 使用 |render 过滤器将内容转换为HTML，再用 |safe 输出 #}
        {% categoryDetail categoryContent with name="Content" %}
        {{ categoryContent|render|safe }}
    </div>
    

    选择哪种方式取决于您的具体需求和内容管理习惯，但核心都是要确保内容能被正确解析和展示。

四、自定义分类字段的展示

安企CMS的强大之处在于其灵活的内容模型。如果您的分类所属模型定义了额外的自定义字段（例如“分类特色”、“产品型号”等），您也可以在分类详情页进行展示。

例如，如果您在分类模型中定义了一个名为“分类特色”的自定义字段，可以这样访问：

<div class="category-features">
    <h4>分类特色</h4>
    <p>{% categoryDetail with name="分类特色" %}</p>
</div>

或者，如果您想遍历所有自定义字段：

<div class="category-extra-info">
    {% categoryDetail extras with name="Extra" %}
    {% for field in extras %}
        <p><strong>{{ field.Name }}：</strong>{{ field.Value }}</p>
    {% endfor %}
</div>

这种方式特别适用于那些自定义字段较多，或者不确定具体字段名称的场景。

五、优化SEO：TDK标签的应用

分类描述（Description）的一个重要用途是作为页面的Meta Description，这对搜索引擎排名和用户点击决策有着直接影响。安企CMS提供了 tdk 标签来统一管理页面的TDK（Title,