如何自定义文章、产品、分类页面的模板布局?

📅 👁️ 72

在安企CMS中,灵活地自定义页面模板布局是提升网站个性化和用户体验的关键一步。无论是文章、产品详情页,还是分类列表页,安企CMS都提供了强大而直观的工具,让您无需深入编程,也能轻松打造独具风格的页面。

让我们一起探索如何在安企CMS中,将您的设计理念变为现实。

安企CMS 模板基础概览

在开始自定义之旅前,了解一些安企CMS模板的基本约定会非常有帮助。所有的模板文件都存放在网站根目录下的 /template 文件夹中,而模板所使用的样式(CSS)、JavaScript脚本和图片等静态资源,则统一放置在 /public/static/ 目录。

安企CMS的模板语法简洁高效,类似于Django模板引擎的风格。您会遇到两种主要的标记:

  • 双花括号 {{变量}}:用于输出变量或数据。
  • 单花括号和百分号 {% 标签 %}:用于实现逻辑控制,如条件判断(if)、循环(for)以及调用特定的功能标签。

所有模板文件均采用UTF-8编码,确保内容正确显示。此外,安企CMS支持多种网站模式,包括自适应、代码适配以及PC+移动端独立站点模式,这表示您可以为移动端内容创建单独的模板,它们通常存放在模板目录下的 mobile/ 子目录中。

核心:理解模板文件结构与命名约定

要自定义页面布局,首先需要掌握模板文件的存放位置和命名规则。每一套模板都在 /template 下拥有自己的独立目录,其中包含一个 config.json 文件,用于描述模板的基本信息。

安企CMS支持两种模板组织模式:文件夹组织模式和扁平化文件组织模式。无论选择哪种,都有一些约定俗成的默认模板文件:

  • 首页: 通常是 index/index.htmlindex.html
  • 模型首页(如文章或产品列表首页): {模型table}/index.html{模型table}_index.html
  • 文档(文章/产品)详情页: {模型table}/detail.html{模型table}_detail.html
  • 文档(文章/产品)列表页(分类页): {模型table}/list.html{模型table}_list.html
  • 单页面详情页: page/detail.htmlpage.html

自定义模板的威力:

除了这些默认名称,安企CMS最强大的地方在于其灵活的自定义模板命名能力。这意味着您可以为特定的文章、产品或分类页面指定独一无二的模板文件。例如:

  • 如果您有一篇ID为10的文章,想要一个专属布局,可以创建一个名为 article/detail-10.html 的模板。
  • 如果有一个ID为5的产品分类,您希望其列表页与众不同,可以创建 product/list-5.html
  • 对于“关于我们”这样的单页面,您可以设计一个 page/about.html 模板,并在后台创建该单页面时,将其“单页面模板”设置为 about.html

接下来,我们将分模块详细讲解如何利用这些能力。

定制文章与产品详情页模板

文章和产品在安企CMS中都属于“文档”范畴,它们共用一套灵活的内容模型体系。

  1. 创建自定义字段(如果需要): 许多时候,默认的标题、内容等字段可能不足以展示您所需的所有信息。例如,产品可能需要“型号”、“品牌”、“技术参数”等字段,文章可能需要“作者来源”、“发布机构”等。 您可以在后台进入 “内容管理” -> “内容模型”,编辑或新增模型,然后为该模型添加自定义字段。这里支持单行文本、数字、多行文本、单选、多选、下拉选择等多种字段类型。这些自定义字段将极大地丰富您的内容展示能力。

  2. 在后台指定模板: 当您编辑或发布一篇新文章或产品时,在编辑界面的“其他参数”部分,会找到一个名为 “文档模板” 的字段。在这里,您可以填写您为该特定文档创建的自定义模板文件名,例如 article_special_layout.htmlproduct_showcase.html。请确保这个模板文件实际存在于您的模板目录中。

  3. 在模板中调用数据: 在自定义的详情页模板(例如 article/detail.html 或您自定义的 article_special_layout.html)中,您可以使用各种标签来调取内容。

    • 基础内容:
      • 文章/产品标题:{{archive.Title}}
      • 文章/产品内容:{{archive.Content|safe}} (注意这里的 |safe 过滤器,它能确保HTML代码被正确解析而不是转义显示)
      • 缩略图:<img src="{{archive.Thumb}}" alt="{{archive.Title}}" />
      • 发布时间:{{stampToDate(archive.CreatedTime, "2006-01-02")}}
      • 浏览量:{{archive.Views}}
    • 自定义字段: 如果您的内容模型定义了额外的字段(例如,您添加了一个名为 product_model 的产品型号字段),您可以通过以下方式调用:
      • 直接调用:`{% archiveDetail with name=”

相关文章

网站首页的TDK(Title、Keywords、Description)信息在哪里设置和显示?

网站首页的TDK(Title、Keywords、Description)信息,对于网站在搜索引擎中的表现至关重要。它不仅是搜索引擎理解网站核心内容的关键,也是用户在搜索结果页面决定是否点击网站的重要依据。安企CMS作为一款高效的内容管理系统,提供了直观便捷的TDK管理功能,让我们可以轻松优化网站首页在搜索引擎中的可见度。 ### 网站首页TDK的设置位置 在安企CMS中

2025-11-07

如何将多语言内容切换按钮显示在网站前端?

在AnQiCMS上,让网站前端显示多语言内容切换按钮,对于拓展全球用户群体、提升用户体验至关重要。AnQiCMS以其强大的多语言支持和灵活的模板机制,让实现这一功能变得直观而高效。 ### AnQiCMS的多语言机制概览 AnQiCMS在设计之初就考虑到了全球化的内容发布需求。它的多语言支持核心在于“多站点管理”功能。这意味着,您可以通过在后台创建不同的站点来代表不同的语言版本。例如

2025-11-07

安企CMS如何配置URL伪静态规则以优化搜索引擎抓取?

在网站运营中,搜索引擎优化(SEO)扮演着至关重要的角色,而友好的URL结构则是提升网站在搜索引擎中表现的关键一环。一个清晰、有意义的URL不仅能帮助搜索引擎更好地理解页面内容,也能让访问者一眼看出页面的主题,提升用户体验。传统的动态URL往往包含难以理解的参数,这对SEO和用户都不够友好。幸运的是,安企CMS提供了强大的伪静态规则配置功能,让您可以轻松优化网站的URL结构。 ###

2025-11-07

如何在文章详情页显示自定义SEO标题而不是文章标题?

在内容运营中,网站文章详情页的标题设置是一个关键环节。我们经常会遇到这样的情况:文章本身的内容标题需要引人注目,富有创意,以吸引读者的点击;而搜索引擎优化(SEO)所需要的页面标题(即浏览器标签页上显示的`<title>`标签内容),则更侧重于关键词的布局、长度控制以及对搜索引擎的友好性。在AnQiCMS中,您完全可以灵活地管理这两种不同的标题,确保用户体验和SEO效果两不误。 ###

2025-11-07

如何在模板中获取并展示文章的缩略图或封面大图?

安企CMS在内容展示的灵活性方面一直备受好评,其中图片作为吸引用户和传递信息的核心元素,如何在模板中高效、准确地获取并展示文章的缩略图或封面大图,是许多网站运营者关注的焦点。这篇文章将详细解析安企CMS的模板机制,带你一步步掌握图片调用的技巧。 ## 安企CMS如何智能地处理图片 在安企CMS中,图片的管理和展示都设计得非常灵活高效。当你上传图片作为文章的缩略图或内容中的图片时

2025-11-07

如何使用`archiveList`标签按浏览量排序显示热门文章列表?

在安企CMS中,如何通过 `archiveList` 标签展示热门文章列表? 在内容运营中,将网站上的热门文章清晰地展示给访客,不仅能有效提升用户体验,引导用户发现更多精彩内容,还能通过内容的有效分发,间接促进搜索引擎优化(SEO)。安企CMS提供了强大且灵活的模板标签功能,其中 `archiveList` 标签就是实现这一目标的核心工具。本文将引导您如何利用 `archiveList` 标签

2025-11-07

怎样在导航栏中显示二级或多级分类列表?

网站导航就像是您的网站的骨架,它引导访客浏览网站的不同部分,找到他们感兴趣的内容。一个清晰、直观的导航系统对于提升用户体验和网站的专业度至关重要。安企CMS深知这一点,为您提供了灵活多样的方案来构建和管理网站的导航,特别是对于需要展示二级甚至多级分类列表的复杂导航结构。 今天,我们就来深入了解如何在安企CMS中设置并显示这些层级分明的分类列表,让您的网站导航更加强大和智能。 ###

2025-11-07

文章内容中的Markdown格式如何正确渲染为HTML并显示数学公式?

在使用AnQiCMS撰写文章时,我们常常希望内容不仅限于纯文本或简单的富文本,而是能够支持更丰富的格式,特别是Markdown语法带来的便捷性,以及在科学、技术内容中不可或缺的数学公式。这不仅能提升内容质量,也能为读者提供更好的阅读体验。 AnQiCMS深知内容多样性的重要,因此在系统中提供了对Markdown的支持。但要让这些Markdown内容,尤其是复杂的数学公式

2025-11-07