AnQiCMS 提供了高度灵活的前端内容展示布局自定义能力,让网站能够根据具体需求呈现独具风格的视觉效果和信息结构。这不仅关乎网站的外观,更在于如何高效、精准地将内容传达给访问者。通过理解 AnQiCMS 的模板机制和各项功能,用户可以轻松实现从整体主题风格到单篇内容展示的精细化控制。
模板是前端布局的核心
在 AnQiCMS 中,网站的前端布局主要通过模板(Templates)来实现。这些模板文件通常以 .html 为后缀,统一存放在系统的 /template 目录下。每一套网站主题都拥有一个独立的模板文件夹,其中包含一个 config.json 文件来定义主题的名称、类型等基本信息。AnQiCMS 采用了类似 Django 模板引擎的语法,这使得熟悉 Web 开发的用户能够很快上手。它支持变量输出(如 {{变量}})、条件判断({% if %})、循环遍历({% for %})等多种控制结构,为动态内容展示提供了强大支持。
在模板类型上,AnQiCMS 提供了自适应(响应式)、代码适配以及 PC+手机独立站点三种模式。这意味着无论您的网站目标用户主要使用哪种设备,都能找到合适的模板策略来优化其访问体验。
自定义内容展示的层级与方法
AnQiCMS 的前端布局自定义可以从多个层面展开:
整体站点主题与布局切换: 想象一下您的网站就像一个舞台,模板就是这个舞台的整体布景设计。通过在后台选择不同的模板主题,您可以一键切换网站的整体风格和布局。每个主题都带有自己的
config.json文件,定义了该主题的特性。如果您想开发全新的主题,只需在/template目录下创建新的文件夹,并按照约定组织文件即可。页面级别的通用布局调整: 网站中的每一个页面类型(比如首页、文章列表页、文章详情页)都有其对应的模板文件。例如,
index/index.html对应首页,{模型table}/detail.html对应内容详情页,{模型table}/list.html对应内容列表页。为了提高模板的复用性,您可以将页眉、页脚、侧边栏等常用部分提取出来,放入partial/目录下,然后在需要的地方通过{% include "partial/header.html" %}这样的标签轻松引用。这种模块化的设计,让维护和更新变得更加高效。内容模型与自定义字段的深度定制: AnQiCMS 的强大之处在于其“灵活的内容模型”功能。它允许您根据业务需求创建或修改内容模型,而不仅仅局限于传统的文章和产品。您可以为每一种内容类型(如新闻、产品、案例、服务等)定义独有的字段,例如,为“产品”模型添加“颜色”、“尺寸”、“材质”等自定义属性。这些自定义字段可以在内容管理后台方便地填写,并在前端模板中通过
{% archiveParams %}或直接通过{{archive.自定义字段名}}的方式调用并展示,实现内容的个性化展示。精细到单篇内容的布局控制: 如果您想对某一篇特定的文章、某一个分类页面,甚至是某一个单页面进行独一无二的布局设计,AnQiCMS 也提供了这样的粒度控制。在发布或编辑内容(文章、产品、单页、分类)时,后台提供了“文档模板”、“分类模板”或“单页面模板”的选项。您可以在此处指定一个自定义的模板文件(例如
download.html),该内容将不再使用默认模板,而是加载您指定的文件来展示。这使得您可以为一些特殊的页面(如落地页、活动页)提供完全定制化的设计,而不影响其他页面的通用布局。利用模板标签动态展示数据: 真正让前端布局活起来的,是 AnQiCMS 提供的丰富模板标签。这些标签是连接模板和后台数据的桥梁,让您能够动态地调取和展示各类信息:
- 全局信息类标签:
{% system %}可以获取网站名称、LOGO、备案号等全局配置;{% contact %}则能调取联系方式;{% tdk %}帮助您管理页面的 SEO 标题、关键词和描述;{% navList %}用于构建灵活多变的导航菜单。 - 内容展示类标签:
{% archiveList %}和{% archiveDetail %}用于文章或产品列表和详情的展示;{% categoryList %}和{% categoryDetail %}处理分类信息的列表和详情;{% pageList %}和{% pageDetail %}则用于单页面的列表和详情展示;{% tagList %}和{% tagDataList %}用于标签及其关联内容的展示。 - 逻辑与辅助标签:在模板内部进行逻辑判断(
{% if %})或循环输出({% for %})同样简单直观。{% pagination %}标签能轻松实现内容的分页功能,{% prevArchive %}和{% nextArchive %}方便实现上一篇/下一篇功能。此外,还有stampToDate用于时间格式化,以及include、extends和macro等标签,用于模板的复用和结构化。
- 全局信息类标签:
内容显示细节的优化: 除了结构上的布局,内容的视觉呈现细节也同样重要。AnQiCMS 在内容设置中提供了图片处理选项,如是否自动将上传的图片转换为 WebP 格式以优化加载速度、是否自动压缩大图、以及多种缩略图生成方式(按最长边等比缩放、按最长边补白、按最短边裁剪),并允许您自定义缩略图的尺寸。这些功能可以帮助网站在保证视觉效果的同时,提升页面加载性能。此外,系统还内置了 Markdown 编辑器支持,以及通过集成第三方库来支持数学公式和流程图的渲染,让内容的展示形式更加丰富。
通过以上多层次、多维度的自定义方式,AnQiCMS 赋予了用户极大的自由度,能够将网站的前端布局设计得既符合品牌形象,又贴合用户体验,从而更好地实现网站的内容运营目标。
常见问题 (FAQ)
1. 我应该把自定义的模板文件放在哪里?它们的文件名有什么约定吗?
您的自定义模板文件应放在 /template 目录下,每个主题一个独立的子文件夹。AnQiCMS 遵循一套约定来匹配模板文件:
- 公共代码片段:可以放在主题文件夹内的
partial/目录中,如header.html、footer.html。 - 首页:
index/index.html或index.html。 - 内容模型首页:
{模型table}/index.html或{模型table}_index.html。 - 文档列表页:
{模型table}/list.html或list-{分类ID}.html,也可以是page/{单页面ID}.html。 *