中英双语 SaaS 营销官网模板 + 配套可视化内容中心 CMS(SQLite 持久化、事务与版本保护、可视化 MDX 编辑、一键发布到模板)。买模板送后台的完整闭环套装。
Next.js模板
交付包内说明
zhixu-saas-bundle-1.0.0
2026-09-11
1 个文件 / 模块
买断商业授权(一次购买,可商用、可修改、可去署名)
本套装 = 官网模板 + 配套可视化内容中心 CMS。相比纯模板档,套装额外提供一个专为本模板打造的可视化后台,让非开发者也能改文案、发文章、管页面。
开箱即用的中英双语 SaaS 营销网站模板,基于 Next.js 16 + React 19 + Tailwind v4,内置从品牌介绍到线索转化的完整营销漏斗与内容中心,静态导出一键部署,买断可商用、可改、可去署名。
⚠️ 模板本身是纯前端营销站(静态导出);后台内容管理由套装内的「知序内容中心 CMS」提供(可视化编辑 + SQLite 持久化,详见下方)。演示图片仅供预览需自行替换;环境 Node.js 20+ 与 pnpm 11。
知序 Zhixu 是面向 B2B / SaaS 团队的营销网站模板,覆盖从品牌介绍、产品教育到线索转化的完整链路。
适合:企业官网、产品发布站、营销落地页、演示 Demo 站。
内置以人力资源 / 企业协作为背景的原创 SaaS 叙事,可直接改成你自己的产品文案。
它不是含登录、数据库、后台业务的完整 HR SaaS——而是一套可自由改造的营销前端。
/ 语言选择页/[locale]/ 本地化首页与完整营销漏斗(Hero / 产品界面示意 / 客户背书 / 功能区块 / 价格 / 评价 / 转化 CTA)/features 产品功能详情/integrations 应用集成目录/pricing 价格方案 + 常见问题(月付 / 年付切换)/book-a-demo 预约产品演示/contact 联系销售与支持/about 公司故事、使命与数据/changelog 产品更新日志/articles 团队洞察文章列表与详情(MDX)技术栈:Next.js 16 App Router · React 19 · TypeScript · Tailwind CSS v4 + 全局设计令牌。
内容:本地 MDX + YAML front matter,自动中文阅读时间,静态路由生成,GFM 表格 / 列表与自定义 MDX 组件。
体验:中文字体栈与阅读节奏优化;桌面 / 平板 / 移动端响应式;移动端折叠菜单;FAQ 手风琴;遵循 prefers-reduced-motion。
构建:output: export 纯静态导出,产物可放任意 CDN / 静态托管。
模板分两层内容,各司其职:
src/config/product.ts——改数组即生效,不碰组件。content/articles/zh-CN、/en),YAML front matter 管理标题 / 摘要 / 日期 / 分类 / 作者 / 封面。文章内置 9 个开箱组件、无需 import:
Callout 提示框 · PullQuote 重点引语 · Figure 带图注配图Steps/Step 操作步骤 · Checklist 检查清单 · MetricGrid/Metric 数据组LinkCard 延伸阅读 · Badge 状态标记 · Details 折叠详情支持 GFM 表格 / 列表,自动计算中文阅读时间,generateStaticParams 生成静态文章路由。写 Markdown 就能排出专业文章,不必碰前端代码。
zhixu-saas-template/
├─ src/
│ ├─ app/ Next.js App Router 页面
│ │ ├─ [locale]/ 本地化页面(首页/功能/集成/价格/预约演示/联系/关于/更新日志/文章)
│ │ ├─ (landing)/ 语言选择落地
│ │ ├─ globals.css 设计令牌(颜色/字体)
│ │ └─ icon.svg 站点图标
│ ├─ config/ 站点配置(改文案主要在这里)
│ │ ├─ brand.ts 品牌名/站点描述/页脚
│ │ ├─ contact.ts 通用/销售/支持/隐私邮箱与办公地址
│ │ ├─ product.ts 功能/价格/集成/FAQ/更新日志(双语数据)
│ │ ├─ seo.ts SEO / Open Graph / Twitter
│ │ ├─ forms.ts · preset.ts · site.ts 表单模式/预设/站点
│ │ └─ content/home.ts 首页各区块内容
│ ├─ components/ UI 组件(含 mdx-components.tsx —— 9 个文章组件)
│ ├─ i18n/ config.ts(locale 列表)· dictionary.ts(公共文案)
│ └─ lib/ 文章读取与工具
├─ content/articles/ 文章 MDX 源(zh-CN / en)
├─ public/ 静态资源(含仅预览的演示图片,上线前替换)
├─ docs/ 买家文档(zh-CN / en:产品/快速开始/部署/授权/退款…)
├─ scripts/ 内容校验 / 发布打包脚本
├─ .env.example 环境变量样例
└─ next.config.ts · tsconfig.json · package.json · pnpm-workspace.yaml
改动指引:文案与营销数据集中在 src/config/(尤其 product.ts、content/home.ts);文章写在 content/articles/{zh-CN,en}/.mdx;设计令牌在 src/app/globals.css 顶部;品牌图标 src/app/icon.svg;演示图片在 public/ 下,上线前务必替换。
本商品为买断商业授权:一次购买,可用于你自己或客户的商业项目,可按需修改、可去页脚署名,并向获许可客户交付成品站。含 12 个月产品更新与邮件支持;完整条款见包内 docs/zh-CN/LICENSE.md。
禁止:作为独立模板 / 源码包转售、再分发、再许可、共享、出租;发布到公共代码仓库;加入主题市场 / 无代码平台等允许第三方下载导出源码的服务。
付款后在订单详情页获取:加密源码包下载链接 + 解压密码 + 授权证书。
环境:Node 20+ / pnpm 11。
快速开始:
cp .env.example .env.local
pnpm install --frozen-lockfile
pnpm dev
访问 /zh-CN/ 或 /en/。
主要改动入口:
src/config/brand.tssrc/config/contact.tssrc/config/product.tssrc/config/content/home.tssrc/config/seo.ts上线前把示例域名换成你的 NEXT_PUBLIC_SITE_URL,替换 OG 图与演示图片。一键部署 Vercel / Netlify / Cloudflare Pages。
支持:含 12 个月产品更新与邮件支持,范围含安装、文档内配置、可复现构建失败、未修改模板中的确认缺陷,目标 3 个工作日内首次响应。
不含:定制设计、内容撰写、第三方账号配置、代部署、后端开发、法律合规审查。
退款:源码类下载后原则不退(法律强制除外)。购买 14 天内,若压缩包损坏且无替代、未修改模板无法按文档在受支持环境构建、或同一订单重复扣款,可申请退款。
public/images/)仅供预览、不含生产使用授权,买家须自行替换兼容环境待商家补充