首页模板开发
本文介绍如何从零开发一套 Cloud Blox 首页模板：模板是什么、最小可用模板（3 个文件）、如何预览和切换。面向模板开发者，按步骤操作即可完成一套可用的门户首页。更多细节见侧栏子页。
模板是什么
- 首页模板用于定制「门户首页」：用户访问站点根路径（未进入管理后台）时看到的页面，如产品介绍、定价、功能展示、文档中心等。
- 系统支持多套模板，管理员在 系统管理 → 运维监控 → 系统配置 的「首页模板」Tab 中选择当前使用的模板；切换后，访问根路径即看到该模板渲染的页面。
- 模板由静态 HTML 模板文件、配置文件与可选静态资源/文档组成，放在项目约定的模板根目录下（通常为
templates），每个子目录代表一套模板，目录名即模板 ID。
快速开始：最小模板（3 个文件）
创建一个最小可用模板只需 3 个文件：
| 文件 | 说明 |
|---|---|
config.yaml | 必须。模板元数据（名称、版本、作者、描述等）。 |
layout.html | 必须。所有页面的公共布局外壳。 |
home.html | 必须。至少一个页面；home.html 对应根路径 /。 |
步骤一：创建模板目录
在模板根目录下新建一个目录，目录名即模板 ID（建议小写、数字、连字符），例如 my-theme。
步骤二：编写 config.yaml
在模板目录下创建 config.yaml，内容示例：
name: "我的模板"version: "1.0.0"author: "你的名字"description: "一句话描述模板用途"preview: "preview.png" # 可选，预览图文件名（相对模板目录）步骤三：编写 layout.html
所有页面共用的布局，必须定义名为 layout 的块，并包含 content 与 extra_css 两个可被子页面覆盖的块。示例：
{{define "layout"}}<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>{{.PageTitle}}</title> <meta name="description" content="{{.PageDesc}}"> {{block "extra_css" .}}{{end}}</head><body> <header><a href="/">{{.Site.Title}}</a></header> <main>{{block "content" .}}{{end}}</main> <footer>{{.Site.Copyright}}</footer></body></html>{{end}}{{.PageTitle}}、{{.PageDesc}}：当前页面标题与描述（可由 routes 配置 覆盖）。{{.Site.Title}}、{{.Site.Copyright}}：站点级配置，来自后台「网站配置」。- 使用 Go 标准
html/template语法，详见 模板数据与可用函数。
步骤四：编写 home.html（首页）
在模板目录下创建 home.html，覆盖 content 块即可：
{{define "content"}}<section> <h1>欢迎使用 {{.Site.Title}}</h1> <p>{{.Site.Description}}</p></section>{{end}}步骤五：在后台切换模板
- 进入 系统管理 → 运维监控 → 系统配置，打开「首页模板」Tab。
- 在「当前使用的模板」下拉中选择刚创建的模板（显示为 config 中的
name）。 - 保存后，访问站点根路径即可看到新模板。