README

当前使用Foundation 6.5.1。

JointsWP 要求

JointsWP 需要 Node.js v6.9.x 或更高版本。这并不意味着你需要理解 Node（甚至 Gulp）——这只是我们确保所有开发工具都安装所需的步骤。

入门指南

下载 JointsWP 并使用 npm 安装依赖项

$ cd my-wordpress-folder/wp-content/themes/
$ git clone https://github.com/JeremyEnglert/JointsWP.git
$ cd JointsWP
$ npm install

此时，JointsWP 应已安装在您的本地机器上并完全运行。如果您更喜欢手动安装主题，那也可以——只需确保在将文件手动移动到 /themes/ 目录后运行 npm install 即可。

使用 JointsWP

监控更改

$ npm run watch

• 监控 assets/styles/scss 目录中的更改。当发生更改时，SCSS 文件将被编译，与 Foundation 文件连接并保存到 /styles 目录。将创建源映射。
• 监控 assets/scripts/js 目录中的更改。当发生更改时，JS 文件将被编译，与 Foundation JS 文件连接并保存到 /scripts 目录。将创建源映射。
• 监控 assets/images 目录中的更改。当发生更改时，图像文件将被优化并覆盖原始图像保存。

使用 Browsersync 监控更改

$ npm run browsersync

这将监控与 npm run watch 相同的文件，但利用 Browsersync 进行实时重载和样式注入。请确保更新 gulpfile.js 中的 URL 变量为您本地的安装 URL。

编译和压缩所有主题资源

$ npm run build

编译和压缩所有脚本和样式。

编译特定资源

• $ npm run styles - 编译 assets/styles/scss 目录中的所有 SCSS 文件。
• $ npm run scripts - 编译 assets/scripts/js 目录中的所有 JS 文件。
• $ npm run images - 优化 assets/images 目录中的所有图像文件。

文件结构 - "放置物品的位置"

自定义样式

• style.css - 此文件实际上从未被加载，但这是您设置主题名称的地方，并且是 WordPress 所必需的
• assets/styles/scss/style.scss - 在此处导入所有样式。如果您创建了一个额外的 SCSS 文件，请确保在此处导入它。
• assets/styles/scss/_main.scss - 在此处放置所有自定义样式。
• assets/styles/scss/_settings.scss - 在此处调整 Foundation 样式设置。
• assets/styles/scss/login.scss - 在此处放置自定义登录样式。这将生成自己的样式表。

自定义脚本

• assets/scripts/js/ - 在此处放置您的自定义脚本。每个 .JS 文件在构建过程中运行时将被编译和连接。

图像

• assets/images/ - 在此处放置您的主题图像。每个图像在构建过程中运行时将被优化。