如何在 AnQiCMS 模板中获取并显示自定义内容模型的扩展字段?

📅 👁️ 79

在 AnQiCMS 模板中灵活地获取并显示自定义内容模型的扩展字段,是实现网站个性化内容展示的关键。AnQiCMS 强大的内容模型定制能力,让我们能够根据实际业务需求,为文章、产品等内容添加各种独特的属性,而如何在前端模板中将这些自定义数据精彩呈现,正是我们今天要深入探讨的主题。

AnQiCMS 内容模型的灵活性

AnQiCMS 作为一个基于 Go 语言开发的企业级内容管理系统,其核心亮点之一便是”灵活的内容模型”。这意味着我们不仅仅局限于传统的”标题”、”内容”等固定字段,而是可以根据具体业务场景,在后台为不同的内容类型(如:文章、产品、活动等)创建专属的扩展字段。

举例来说,如果你运营一个电商网站,在产品模型中可能需要添加“产品 SKU”、“品牌”、“库存数量”、“产品规格”等字段;如果是博客文章,则可能需要“作者简介”、“阅读时长”、“参考资料”等字段。这些在后台“内容管理”下的“内容模型”中创建的字段,都统称为自定义内容模型的扩展字段。在创建这些字段时,我们会设置一个“参数名”(供后台显示)和一个“调用字段”(供模板调用),后者正是我们在模板中获取数据的重要标识。

获取自定义字段的核心思路

在 AnQiCMS 的模板体系中,无论您是在查看单个文档详情页,还是在列表页循环展示内容,获取这些自定义扩展字段的核心思路都是一致的:它们被视为文档(或内容)对象的一部分。AnQiCMS 提供了功能强大的模板标签,让我们可以像访问内置字段一样,轻松地访问这些自定义字段。

在模板中获取并显示单个扩展字段

当你明确知道要显示哪个自定义扩展字段时,archiveDetail 标签是您的首选。这个标签主要用于在文档详情页获取当前文档的详细信息,当然也可以通过指定 ID 或 URL 别名来获取其他文档的详情。

要获取一个特定的自定义字段,您需要使用 name 参数,并将其值设置为您在后台“内容模型”中定义的该字段的“调用字段”名称。

例如,如果您在产品模型中自定义了一个名为“产品 SKU”的字段,其“调用字段”为 productSku,那么在产品详情页的模板中,您可以这样获取并显示它:

<p>产品 SKU:{% archiveDetail with name="productSku" %}</p>

如果想将其赋值给一个变量以便后续处理,可以这样做:

{% archiveDetail currentProductSku with name="productSku" %}
<p>当前产品的 SKU 是:{{ currentProductSku }}</p>

这样,模板解析时就会将对应产品的 SKU 值替换到 {{ currentProductSku }} 的位置。

遍历所有扩展字段

有时候,我们可能不确定某个内容模型具体有哪些自定义字段,或者希望动态地展示所有已定义的扩展字段及其值,例如在产品详情页统一列出所有产品参数。这时,archiveParams 标签就能派上大用场了。

archiveParams 标签允许我们获取当前文档(或指定文档)的所有自定义参数,并以数组或无序 Map 对象的形式返回。通常,我们倾向于获取一个固定排序的数组对象,这样就可以通过 for 循环轻松遍历并展示。

下面是一个在文档详情页遍历并显示所有自定义字段的示例:

<h3>产品参数:</h3>
<ul>
    {% archiveParams params %}
    {% for item in params %}
    <li>
        <strong>{{ item.Name }}:</strong>
        <span>{{ item.Value }}</span>
    </li>
    {% endfor %}
    {% endarchiveParams %}
</ul>

在这个例子中:

  • {% archiveParams params %} 将当前文档的所有自定义字段数据赋值给 params 变量。
  • {% for item in params %} 循环遍历 params 数组。
  • {{ item.Name }} 会输出该自定义字段在后台设置的“参数名”(例如“产品 SKU”)。
  • {{ item.Value }} 会输出该自定义字段的具体值(例如“AQ-001”)。

通过这种方式,即使您未来在后台为内容模型添加了新的自定义字段,前端模板也无需修改,就能自动同步显示这些新字段及其值,大大提升了模板的可维护性和灵活性。

如果您希望获取无序的 Map 对象(例如,当您需要通过字段的“调用字段”来直接访问其值时),可以在 archiveParams 标签中添加 sorted=false 参数。

{% archiveParams params with sorted=false %}
<div>
    <span>作者:</span>
    <span>{{ params.author.Value }}</span>
</div>
{% endarchiveParams %}

处理特殊字段类型

自定义字段的类型多种多样,例如单行文本、数字、多行文本、单项选择、多项选择、下拉选择等。其中,富文本编辑器或 Markdown 格式的字段,以及图片组字段,在前端显示时需要一些额外的处理。

富文本/Markdown 内容的渲染

如果您的自定义字段存储的是包含 HTML 或 Markdown 语法的富文本内容(例如“产品介绍”字段可能包含加粗、图片等格式),直接输出 {{ item.Value }} 可能会因为模板的自动转义机制而导致 HTML 标签被显示为纯文本。

此时,我们需要使用 safe 过滤器来告诉模板这些内容是安全的 HTML,不应进行转义:

{% archiveDetail productDescription with name="productDescription" %}
<div class="product-description">
    {{ productDescription|safe }}
</div>

如果您的自定义字段内容是 Markdown 格式,您还需要额外使用 render 过滤器将其转换为 HTML,然后再使用 safe 过滤器:

{% archiveDetail markdownContent with name="markdownContent" %}
<div class="markdown-output">
    {{ markdownContent|render|safe }}
</div>

图片组或多选字段的显示

对于图片组(多个图片 URL)或多项选择(多个值)这类自定义字段,它们的值通常以数组的形式存储。在模板中显示时,您需要再次使用 for 循环来遍历这些子项。

例如,如果您定义了一个“产品图集”字段,其“调用字段”为 productImages

{% archiveDetail productImages with name="productImages" %}
<div class="product-gallery">
    {% for imageUrl in productImages %}
    <img src="{{ imageUrl }}" alt="产品图片" />
    {% endfor %}
</div>

这个例子展示了如何遍历 productImages 数组中的每个图片 URL,并将其显示为 <img> 标签。

总结

AnQiCMS 的自定义内容模型及其灵活的模板标签体系,为我们打造高度个性化和功能丰富的网站提供了坚实基础。无论是精确获取单个扩展字段,还是动态遍历所有自定义参数,亦或是处理特殊内容类型,AnQiCMS 都提供了直观且强大的方法。掌握这些技巧,您就能让网站内容在前端焕发活力,更好地满足用户需求和业务目标。


常见问题 (FAQ)

**Q1:

相关文章

AnQiCMS 如何在文档内容中实现图片懒加载,提升页面加载速度?

在网站运营中,页面加载速度始终是用户体验和搜索引擎优化(SEO)的关键因素之一。尤其对于内容丰富的网站,图片往往是拖慢页面速度的“大户”。因此,如何高效管理图片资源,成为提升网站性能不可忽视的一环。今天,我们就来聊聊AnQiCMS是如何巧妙地在文档内容中实现图片懒加载,从而显著提升页面访问速度的。 在AnQiCMS的设计哲学中,网站性能优化是其核心优势之一。基于Go语言的高并发特性

2025-11-09

如何利用 AnQiCMS 的伪静态功能优化 URL 结构以提升搜索引擎显示效果?

在网站运营中,一个清晰、有意义的URL地址,就像网站内容的一张“名片”,它不仅能帮助访问者快速了解页面主题,更是搜索引擎识别、抓取和排名网站内容的关键因素。一个设计良好的URL结构,能显著提升网站在搜索引擎中的表现,带来更多的自然流量。AnQiCMS作为一款高效的内容管理系统,深知URL结构对SEO的重要性,因此提供了强大而灵活的伪静态功能,帮助我们轻松优化网站的URL。 ### 伪静态

2025-11-09

AnQiCMS 模板中如何正确解析并显示富文本编辑器中的 HTML 内容?

在AnQiCMS中管理网站内容,富文本编辑器无疑是我们创作丰富、美观页面的得力助手。它允许我们轻松地添加样式、图片、链接甚至表格,让内容告别枯燥的纯文本。然而,将这些在后台精心编辑的富文本内容,正确无误地呈现在网站前端模板中,是每个AnQiCMS使用者都需要掌握的关键技巧。 当我们在AnQiCMS的后台通过富文本编辑器或Markdown编辑器编辑内容时

2025-11-09

如何在 AnQiCMS 详情页中显示文章或产品的相关 Tag 标签列表?

在网站运营中,如何让用户更高效地找到他们感兴趣的内容,同时提升内容的可见性,是我们经常思考的问题。文章或产品的详情页,除了核心内容外,提供相关的Tag标签列表,无疑是实现这一目标的好方法。AnQiCMS作为一个灵活高效的内容管理系统,提供了直观且强大的Tag标签功能,让您能够轻松地在详情页中展示这些关联信息。 ### 了解AnQiCMS的Tag标签功能 在AnQiCMS后台

2025-11-09

AnQiCMS 的 `categoryList` 标签如何实现多级分类导航的嵌套显示?

在构建一个功能完善的网站时,清晰且易于导航的分类体系是提升用户体验、优化内容结构的关键。AnQiCMS作为一个高效的企业级内容管理系统,提供了灵活的模板标签来满足多样化的内容展示需求。其中,`categoryList` 标签便是实现多级分类导航嵌套显示的核心工具。 ### 理解 `categoryList` 标签的基础功能 首先,让我们了解 `categoryList` 标签的基本用途

2025-11-09

如何在 AnQiCMS 页面中集成 MathJax 或 Mermaid.js 来显示数学公式和流程图?

在 AnQiCMS 页面中集成 MathJax 和 Mermaid.js:轻松显示数学公式与流程图 AnQiCMS 作为一款高效、灵活的内容管理系统,在满足各类内容展示需求方面表现出色。随着技术内容的日益丰富,许多用户会遇到需要在网站中优雅地展示数学公式和流程图的场景。AnQiCMS 通过其内置的 Markdown 编辑器和对模板的灵活支持,使得集成 MathJax 和 Mermaid.js

2025-11-09

AnQiCMS 模板中如何显示文章详情页的上一篇和下一篇文章链接?

在AnQiCMS中,为文章详情页添加“上一篇”和“下一篇文章”的导航链接是提升用户体验、引导用户深入浏览网站内容的关键一环。AnQiCMS强大的模板系统让这项功能实现起来非常直观和高效,它采用了类似Django模板引擎的语法,让开发者能够轻松驾驭。 AnQiCMS的模板文件通常以`.html`作为后缀,存储在`/template`目录下。在这些模板文件中,我们可以通过特定的标签来调用和展示数据

2025-11-09

如何在 AnQiCMS 网站底部调用并显示后台设置的联系方式,例如电话、邮箱?

在网站的底部清晰地展示联系方式,对于提升用户体验和建立信任至关重要。AnQiCMS作为一个高效的内容管理系统,充分考虑了这一点,提供了直观且灵活的方式来管理和显示这些关键信息,例如电话号码和电子邮箱。 ### 一、AnQiCMS 后台联系方式的设置与管理 在AnQiCMS的后台管理界面,你可以轻松找到并配置网站的联系方式。这些设置位于“后台设置”菜单下,选择“联系方式设置”即可进入编辑页面

2025-11-09