3.6 KiB
3.6 KiB
站点模板使用指南
本项目已配置化为可复用模板,可快速克隆并替换为不同主题(数字游民、一人公司、TikTok 运营、独立开发等)。
目录结构
config/ # 配置层
site.config.ts # 主题配置(切换主题只需改 CURRENT_THEME)
index.ts
content/themes/ # 内容层 - 按主题组织
digital-nomad/ # 数字游民主题
messages/
zh.json # 中文文案
en.json # 英文文案
data/
tools.json # 工具数据
app/ # 应用层 - 组件与页面
components/ # 通用 UI 组件
[locale]/ # 多语言路由
lib/
theme-data.ts # 主题数据加载器
切换主题
方式一:环境变量
# .env.local
NEXT_PUBLIC_THEME=solo-company
方式二:修改配置
编辑 config/site.config.ts:
export const CURRENT_THEME: ThemeId =
(process.env.NEXT_PUBLIC_THEME as ThemeId) || "solo-company"; // 改默认值
新增主题步骤
1. 添加主题配置
在 config/site.config.ts 的 THEME_CONFIGS 中添加:
"your-theme-id": {
id: "your-theme-id",
name: "你的主题名",
nameEn: "Your Theme Name",
tagline: "一句话描述",
taglineEn: "Tagline in English",
meta: {
title: "站点标题 | Site Title",
description: "SEO 描述",
},
features: {
roadmap: true,
tools: true,
community: true,
join: false,
course: false,
ebook: true,
},
colors: { primary: "sky", accent: "amber" },
},
在 THEME_IDS 数组中添加 "your-theme-id"。
2. 创建主题内容
复制 content/themes/digital-nomad/ 为 content/themes/your-theme-id/:
content/themes/your-theme-id/
messages/
zh.json # 修改为你的中文文案
en.json # 修改为你的英文文案
data/
tools.json # 修改为你的工具数据
3. 注册数据加载
在 app/lib/theme-data.ts 的 getThemeMessages 和 getThemeToolsData 的 switch 中添加:
case "your-theme-id": {
const mod = locale === "zh"
? await import("@/content/themes/your-theme-id/messages/zh.json")
: await import("@/content/themes/your-theme-id/messages/en.json");
return mod.default;
}
文案结构 (messages)
参考 content/themes/digital-nomad/messages/zh.json:
common- 站点名、导航、按钮等hero- 首页主视觉features- 特性介绍roadmap- 学习路径、天数、电子书、课程tools- 工具区块community- 社区区块footer- 页脚auth- 登录注册
工具数据 (tools.json)
{
"categories": [
{
"id": "category-id",
"icon": "🔧",
"title": "分类名",
"color": "from-sky-500 to-cyan-500",
"bg": "bg-sky-50",
"text": "text-sky-700",
"tools": [
{ "name": "工具名", "desc": "描述", "href": "https://..." }
]
}
]
}
7 天学习路径 (days)
Day 内容当前在 app/data/days.ts,后续可迁移到 content/themes/[theme]/data/days.json 实现按主题切换。
服务配置(支付、PocketBase)
详见 docs/SERVICES.md。支付和 PocketBase 已配置化,可通过环境变量和主题 services 覆盖。
功能开关 (features)
在主题配置中可关闭某些模块:
roadmap- 7 天学习路径tools- 工具推荐community- 社区区块join- 加入社区页course- 课程页ebook- 电子书
(功能开关的 UI 条件渲染待接入)