css - 如何在 Genesis Framework 中应用 Less css

Question

任何人都可以体验过在带有 Bones Child 主题的 Genesis Framework 中应用的 Less CSS 样式吗？我怎样才能开始呢？

请指教！

Answer 1

对于一般的任何 WordPress 主题。首先使用wp_dequeue_style函数删除主题样式表。不要删除这些文件（对于大多数主题，这将是 style.css，可能还有其他一些主题样式表）不要删除这些文件。请注意，Genesis 框架使用操作使样式表入队和出队。删除它们使用remove_action( 'genesis_meta', 'genesis_load_stylesheet' );（来源： http: //www.chriswiegman.com/2013/06/remove-the-default-style-css-in-wordpress-with-genesis/）

比创建一个 index.less 文件，它应该包含如下所示的内容：

@import (less) "style.css"; // correct path to you original /wp_content/themes/{your_theme}/style.css
@import (less) "otherthemefile.css" // correct path to you original /wp_content/themes/{your_theme}/otherthemefile.css
/* custom less code here */

最后将index.less文件编译成类似main.css. 上传main.css到您的主题目录并使用wp_enqueue_style将其加载到您的主题中。