CyyWordpress
一个基于 Bulma 1.x + Underscores (_s) 的现代 WordPress 主题，专为中文博客场景设计。
环境要求
| 依赖 | 最低版本 |
|---|---|
| PHP | 8.1 |
| WordPress | 6.0 |
| Node.js | 20（见 .nvmrc） |
| npm | 10+ |
本地开发环境配置
# 1. 安装正确的 Node.js 版本（推荐使用 nvm）
nvm use # 读取 .nvmrc 自动切换到 Node 20
# 2. 安装前端依赖
npm install
# 3. 启动 Vite 开发服务器（HMR）
npm run dev
# 4. 生产构建（含 contenthash 文件指纹）
npm run build
# 5. 生成 RTL 样式
npm run build:rtl
注意： 开发时，将 WordPress 的
WP_HOME指向http://localhost:3000，
Vite 会代理所有请求到本地 WordPress 实例并启用热更新。
构建流程说明
| 命令 | 说明 |
|---|---|
npm run dev |
启动 Vite 开发服务器（端口 3000，支持 HMR） |
npm run build |
生产构建，输出到 assets/（含 contenthash） |
npm run build:rtl |
生成 assets/css/main-rtl.css |
npm run lint |
运行 ESLint + StyleLint |
npm run type-check |
TypeScript 类型检查（不生成文件） |
构建产物由 inc/class-cyywordpress-assets.php 读取 assets/.vite/manifest.json
自动解析带 hash 的文件名注入到 wp_enqueue_*。
SCSS 变量覆盖（子主题）
在子主题的入口 SCSS 文件中，在 @use 'cyywordpress/scss/abstracts/variables' 之前
重新声明你希望覆盖的 CSS 自定义属性：
:root {
--color-primary: #6366f1; /* 换成紫色主题 */
--color-primary-dark: #4f46e5;
}
所有组件均使用 var(--color-primary) 引用，覆盖后全局生效，无需修改源文件。
Customizer 可配置项
后台路径：外观 → 自定义 → 首页横幅
| 选项 | 说明 | 默认值 |
|---|---|---|
| 欢迎横幅文字 | 首页/文章列表顶部的通知文字 | 欢迎来到这！Hello everyone. |
| 显示欢迎横幅 | 是否在首页显示横幅 | 勾选 |
导航菜单位置
| 位置标识 | 显示位置 |
|---|---|
menu-1 |
顶部主导航 |
menu-2 |
页脚导航 |
social |
页脚社交媒体图标链接 |
Widget 区域
| 区域 ID | 位置 |
|---|---|
sidebar-1 |
文章/页面侧边栏 |
sidebar-footer-1 |
页脚左列 |
sidebar-footer-2 |
页脚中列 |
sidebar-footer-3 |
页脚右列 |
sidebar-header |
导航栏右侧 |
块模式 (Block Patterns)
注册在 patterns/ 目录，可在编辑器 插入块 → 模式 → CyyWordpress 中使用：
- Hero 横幅 — 全宽渐变横幅 + CTA 按钮
- 文章卡片网格 — 三列响应式卡片布局
- 行动号召区域 — 居中标题 + 双按钮
PHP 代码规范检查
composer install
./vendor/bin/phpcs
./vendor/bin/phpcbf # 自动修复
规范基于 WordPress Coding Standards + PHPCompatibility（PHP 8.1+）。