moncton/jointswp

该软件包最新版本(v5.3.3)没有可用的许可证信息。

安装: 68

依赖项: 0

建议者: 0

安全性: 0

星标: 1

关注者: 2

分支: 0

开放问题: 0

类型:wordpress-theme

v5.3.3 2019-03-14 16:46 UTC

This package is auto-updated.

Last update: 2024-09-21 02:19:29 UTC


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/ - 将您的主题图像放置于此。每次构建过程运行时,每个图像都将被优化。