hongxiaolu/website

Rancher Website 镜像文档

镜像概述和主要用途

Rancher Website镜像（rancherlabs/website:dev）是用于Rancher官方网站开发和内容管理的Docker镜像。其核心功能是提供实时更新的开发服务器，支持网站内容的实时编辑与预览，同时包含完整的博客贡献工作流，方便开发人员和内容贡献者进行网站开发、博客创作及内容管理。

核心功能和特性

• 实时更新服务器：开发模式下运行时，内容修改可实时同步到服务器，无需重启
• 端口自定义：支持通过命令参数灵活配置服务器运行端口
• 博客贡献工具：提供命令行工具快速创建符合格式的博客文章
• 标准化内容管理：包含博客文章命名规范、front matter模板及资源文件管理机制
• CTA集成：支持在内容中灵活插入调用行动（Call to Action）组件

使用场景和适用范围

• Rancher网站开发人员进行本地开发和功能测试
• 内容创作者撰写、编辑和预览博客文章
• 团队成员通过GitHub浏览器界面远程贡献博客内容
• 需要快速搭建网站开发环境的场景

使用方法和配置说明

开发/编辑环境运行

基础运行方法

使用rancherlabs/website:dev镜像启动实时更新服务器：

bash
./scripts/dev

启动后访问 http://localhost:9000 即可预览网站。

自定义端口

通过传递参数自定义服务器端口：

bash
./scripts/dev 8080

此时服务器将运行在 http://localhost:8080。

博客贡献指南

命令行贡献

使用脚本快速创建新博客文章：

bash
./scripts/new-post "My Super Awesome Blog Post Title"

该命令会在指定目录自动创建符合命名规范的markdown文件。

GitHub浏览器端贡献

1. 文件位置与命名
   在https://github.com/rancherlabs/website/tree/master/content/blog中，选择对应年份文件夹，创建markdown文件。
   文件命名格式：YYYY-MM-DD-blog-post-name.md（前缀为创建日期）

2. Front Matter模板
   文章需包含以下YAML格式的front matter：

   yaml
   ---
   title: 文章标题（将生成h1标题）
   author: 作者名（格式：firstName-lastName）
   date: YYYY-MM-DD
   description: ""
   tags: []
   categories: [blog]
   #image: "/img/featured-images/"
   ---
   

图片资源管理

博客图片需上传至https://github.com/rancherlabs/website/tree/master/src/img/blog。

作者简介管理

作者简介可在https://github.com/rancherlabs/website/tree/master/data/authors中确认或添加。

分支管理

贡献需通过分支进行，提交Pull Request时请以master分支为目标。

调用行动（CTA）使用

所有CTA配置文件位于https://github.com/rancherlabs/website/tree/master/data/cta。

内容内联CTA

在内容中需要插入CTA的位置，使用短代码（CTA名称需与数据文件名一致）：

{{% cta-box "training" %}}

右对齐CTA

在文章front matter中定义CTA（CTA名称需与数据文件名一致）：

yaml
cta: technical-architecture