在当今这个注重品牌和用户体验的时代，网站的视觉风格与布局是其成功运营的关键。安企CMS（AnQiCMS）深知这一点，因此提供了高度灵活的模板定制功能，让即使没有深厚开发背景的用户，也能根据自己的独特需求，打造出个性化十足的网站。

如果您正考虑改变网站的整体风格，或者希望为特定内容设计专属布局，那么了解如何在AnQiCMS中自定义模板将会非常有帮助。这不仅能让您的网站在众多同行中脱颖而出，更能有效提升用户体验，传递独特的品牌信息。

认识安企CMS的模板机制

安企CMS的模板系统设计得相当直观和高效，它采用了类似于Django模板引擎的语法，对于熟悉Web开发的用户来说会非常容易上手。

首先，所有的模板文件都统一存放在站点的根目录下的 /template 文件夹中。每一套独立的模板，都需要在这个目录下拥有一个自己的子文件夹。而模板所需要的图片、CSS样式、JavaScript脚本等静态资源，则会集中放置在 /public/static/ 目录里。

在模板文件中，您会发现两种主要的语法结构：

  • 变量输出：使用双花括号 {{变量}} 来显示数据，比如文章标题 {{archive.Title}}。
  • 逻辑控制：使用单花括号和百分号 {% 标签 %} 来实现条件判断（如 if）、循环遍历（如 for）等复杂逻辑。这类标签通常需要一个对应的结束标签（例如 {% endif %} 或 {% endfor %}）来完成一个代码块。

此外，为了确保网站内容的正确显示，所有模板文件都应采用UTF-8编码格式。

创建和激活您的自定义模板

想要开始定制模板，最推荐的方式是从现有的模板（比如系统默认模板）开始。

  1. 复制现有模板：进入 /template 目录，找到一套您觉得比较接近您需求的模板文件夹（例如 default），然后将其完整复制一份，并给新文件夹取一个具有辨识度的名称，比如 my_custom_theme。
  2. 配置 config.json：进入新创建的 my_custom_theme 文件夹，会看到一个 config.json 文件。这个文件是模板的“身份证”，告诉AnQiCMS关于这套模板的基本信息。您需要编辑它，重点关注以下几个字段：
    • "name"：模板的显示名称，比如 "我的定制主题"。
    • "package"：模板的唯一标识，通常与您的文件夹名称一致，比如 "my_custom_theme"。这个名称只能包含英文字母和数字。
    • "template_type"：这决定了您的网站如何适应不同设备。您可以选择 0 表示自适应模板（一套模板适配所有设备），1 表示代码适配（根据设备类型在服务器端提供不同HTML），或者 2 表示电脑+手机独立模板（需要单独制作手机端模板）。
    • "status"：用于指示模板是否正在使用，0 为未启用，1 为使用中。请注意，同一时间只能有一套模板的 status 为 1。不过，您也可以在后台直接切换模板，系统会自动更新这个状态。
  3. 在后台激活：完成 config.json 的修改后，登录AnQiCMS后台，找到“模板设计”菜单下的“网站模板管理”。在这里，您应该能看到刚刚创建的新模板。点击其旁边的“启用”按钮，您的网站前台就会立即切换到这套新的模板。

探索模板文件的目录结构

AnQiCMS的模板文件组织非常灵活，您可以采用文件夹模式或扁平化模式来管理您的模板文件。无论哪种，都有一套默认的命名约定，让系统能够自动识别并应用相应的模板。

常见的模板文件和目录包括：

  • bash.html：通常用于存放网站的公共部分，比如所有页面都会继承的头部（head）、页脚（footer）等代码。
  • partial/ 目录：存放一些可重用的代码片段，例如侧边栏、面包屑导航等，通过 {% include "partial/sidebar.html" %} 这样的标签可以引入。
  • index/index.html 或 index.html：网站的首页模板。
  • {模型table}/index.html 或 {模型table}_index.html：特定内容模型（如文章、产品）的列表页或首页。
  • {模型table}/detail.html 或 {模型table}_detail.html：特定内容模型的详情页。例如，文章详情页可能是 article/detail.html。
  • {模型table}/list.html 或 {模型table}_list.html：特定内容模型分类下的列表页。
  • page/detail.html 或 page.html：单页面的详情页，例如“关于我们”、“联系我们”等。
  • mobile/ 目录：如果您选择了“代码适配”或“电脑+手机独立站点”模式，这里将存放所有手机端对应的模板文件，其内部结构与PC端模板类似。

值得一提的是，AnQiCMS还支持更精细的模板自定义。例如，您可以为特定ID的文档、分类或单页面创建专属模板，命名方式如 {模型table}/{文档id}.html、{模型table}/list-{分类id}.html 或 page/{单页面id}.html。在后台发布内容时，也可以指定要使用的自定义模板文件名。

利用AnQiCMS标签让内容活起来

模板的核心在于通过标签和变量来动态地展示网站内容和配置信息。AnQiCMS提供了丰富的内置标签，它们是您构建动态网站的利器。

  1. 获取网站全局信息

    • {% system with name="SiteName" %}：轻松获取网站名称、Logo、备案号、版权信息等，这些通常在页眉或页脚等位置使用。
    • {% contact with name="Cellphone" %}：展示网站的联系电话、地址、邮箱、社交媒体账号等，方便用户联系。
    • {% tdk with name="Title" %}：为页面生成动态的SEO标题、关键词和描述，对搜索引擎优化至关重要。例如，通过 {% tdk with name="Title" siteName=true %} 可以将当前页面标题和网站名称组合显示。

  2. 构建灵活的导航与结构

    • {% navList navs %}：获取和展示网站的导航菜单，支持多级导航。您可以利用 for 循环遍历 navs 变量来构建您的菜单结构，通过 {{item.Link}} 和 {{item.Title}} 生成导航链接。
    • {% breadcrumb crumbs %}：生成网站的面包屑导航，提升用户体验和网站结构清晰度。

  3. 动态展示内容

    • {% archiveList archives with type="page" categoryId="1" limit="10" %}：获取文章或产品列表。这是最常用的标签之一，您可以根据分类、模型、推荐属性、排序方式等多种条件来筛选内容。当 type="page" 时，可以配合 {% pagination pages %} 标签实现分页功能。
    • {% archiveDetail with name="Title" %}：在详情页中，直接获取当前文章或产品的详细信息，如标题、内容、缩略图、发布时间等。对于内容字段 Content，通常需要加上 |safe 过滤器 {{archiveContent|safe}}，以确保HTML代码被正确解析而不是转义显示。
    • {% pageList pages %} 和 {% pageDetail with name="Title" %}：分别用于获取单页面列表和单页详情，用法与 archiveList/archiveDetail 类似。

  4. 实现高级逻辑与代码复用

    • {% if 条件 %} ... {% elif 其他条件 %} ... {% else %} ... {% endif %}：进行条件判断，根据不同情况显示不同内容。
    • {% for item in 列表 %} ... {% endfor %}：循环遍历数组或列表，动态生成重复内容块。
    • {% include "partial/header.html" %}：引入其他模板文件，实现代码复用，让模板结构更清晰。您还可以通过 with 参数向引入的模板传递特定变量。
    • `{%