README

Sage 是一个基于 HTML5 Boilerplate、gulp、Bower 和 Bootstrap Sass 的 WordPress 入门主题，将帮助您制作更好的主题。

• 来源: https://github.com/roots/sage
• 主页: https://roots.io/sage/
• 文档: https://roots.io/sage/docs/
• Twitter: @rootswp, @retlehs, @swalkinshaw, @Foxaii, @c2foryou, @austinpray
• 时事通讯: 订阅
• 论坛: https://discourse.roots.io/

要求

有关更多安装说明，请参阅本文件中的安装gulp和Bower部分。

功能

• gulp构建脚本，编译Sass和Less，检查JavaScript错误，优化图片，并合并和压缩文件
• BrowserSync，在测试时保持多个浏览器和设备的同步，并在您开发时将更新的CSS和JS注入到您的浏览器中
• Bower用于前端包管理
• asset-builder用于基于JSON文件的资产管道
• Sass Bootstrap
• 主题包装器
• ARIA角色和微格式
• 文章使用hNews微格式
• 多语言支持和超过30个可用的社区翻译

安装Soil插件以启用其他功能

• 更干净的wp_head和排队资产的输出
• 导航菜单更干净的HTML输出
• 根相关URL
• 良好的搜索（/search/query/）
• 来自HTML5 Boilerplate的Google CDN jQuery片段
• 来自HTML5 Boilerplate的Google Analytics片段

安装

克隆git仓库 - git clone https://github.com/roots/sage.git，然后将目录重命名为您的主题或网站名称。

如果您不使用Bedrock，您需要在开发安装上的wp-config.php中添加以下内容

define('WP_ENV', 'development');

配置

编辑lib/config.php以启用或禁用主题功能

编辑 lib/init.php 以设置导航菜单、帖子缩略图大小、帖子格式和侧边栏。

主题开发

Sage 使用 gulp 作为其构建系统，并使用 Bower 来管理前端包。

安装 gulp 和 Bower

构建主题需要 node.js。我们建议您更新到 npm 的最新版本：npm install -g npm@latest。

从命令行

1. 使用 npm install -g gulp bower 在全局范围内安装 gulp 和 Bower。
2. 导航到主题目录，然后运行 npm install
3. 运行 bower install

现在您已经有了运行构建过程的必要依赖。

可用的 gulp 命令

• gulp — 编译并优化您资产目录中的文件
• gulp watch — 当文件发生变化时编译资产
• gulp --production — 为生产编译资产（无源映射）。

使用 BrowserSync

要使用 gulp watch 期间的 BrowserSync，您需要更新 assets/manifest.json 文件底部的 devUrl 以反映您的本地开发主机名。

例如，如果您的本地开发 URL 是 http://project-name.dev，您将更新文件以读取

...
  "config": {
    "devUrl": "http://project-name.dev"
  }
...

如果您的本地开发 URL 看起来像 https://:8888/project-name/，您将更新文件以读取

...
  "config": {
    "devUrl": "https://:8888/project-name/"
  }
...

文档

Sage 文档可在 https://roots.io/sage/docs/ 找到。

贡献

欢迎所有人为项目做出贡献。我们有 贡献指南 以帮助您开始。

社区

跟踪开发和社区新闻。

• 在 Roots Discourse 中参与讨论
• 关注 @rootswp 在 Twitter 上的动态
• 阅读并订阅 Roots 博客
• 订阅 Roots 通讯