Question

我正在使用Zurb Foundation 5框架和ReduxFramework作为主题选项面板开发WordPress主题。因此，我可以通过各种方式为WordPress主题实现Color Schemes。

使用不同颜色方案的不同样式表。
使用css class和id
+更多方式........

但是，我不想这样做。 ReduxFramework可以动态更改css文件并编写类或id。我想这样做。所以我可以动态修改ReduxFramework Options面板中的Foundation 5 css样式表类和id。改变之后，它必须改变主题配色方案。

Foundation 5有6种主要颜色可供选择。我想从ReduxFramework选项面板中更改它们。

原色
二次色
提醒颜色
成功色彩
正文字体颜色
标题字体颜色

还有什么方法可以修改或更改Redux Framework中Foundation 5 CSS框架附带的每个选项。

请转到此图片链接。 {在新标签中打开此图片以获得更大的视图}

http://i.stack.imgur.com/YI0aD.png

现在的问题是，我该怎么办？

我知道缺少PHP，JS，HTML，CSS，MYSQL等。如果你在答案中描述了所有内容，那么对我来说会更有帮助。

此问题已从Unlimited Colour Schemes in wp theme for Foundation 5 - WordPress Development Stack Exchange:重新发布。一位知名用户建议我在这里提出这个问题！

Answer 1

@Dovy给出的答案是正确的。据我所知，没有基础版的Less版本。所以你需要Foundation的Sass（SCSS）文件和SASS（php）编译器。

似乎Redux也内置了一个Sass编译器：Redux and Sass

安装Foundation代码，例如在WordPress文件夹中运行bower install foundation。
安装php Sass编译器，请参阅：http://leafo.net/scssphp/

现在在Redux配置文件中添加一个保存挂钩：

add_action('redux/options/' . $opt_name . '/saved',  "compile_sass"  );

另见：https://github.com/reduxframework/redux-framework/issues/533

最后将compile_sass函数添加到配置文件中（您可以使用编译操作作为示例，请参阅：http://docs.reduxframework.com/core/advanced/integrating-a-compiler/）：

function compile_sass($values) {
    global $wp_filesystem;

    $filename = dirname(__FILE__) . '/style.css';

    if( empty( $wp_filesystem ) ) {
        require_once( ABSPATH .'/wp-admin/includes/file.php' );
        WP_Filesystem();
    }

    if( $wp_filesystem ) {
    require "scssphp/scss.inc.php";
    $scss = new scssc();
    $scss->setImportPaths("bower_components/foundation/scss/");

    // will search for `assets/stylesheets/mixins.scss'
    $css = $scss->compile('$primary-color: '.$values['primary-color'].';
    @import "foundation.scss"');

        $wp_filesystem->put_contents(
            $filename,
            $css,
            FS_CHMOD_FILE // predefined mode settings for WP files
        );
    }
}

Answer 2

嗯，实际上这很容易。 Foundation使用LESS或SCSS来编译它。他们使用传递给那些编译器的变量。因此，最简单的方法是让Redux在这些颜色字段上使用编译器挂钩，重新输出变量文件，然后在LESS / SCSS上重新运行编译器。蛋糕。：）

Answer 3

我碰巧让它工作从各种评论收集信息，但代码反映了更新版本的redux和基础。共享代码，希望有人发现这个有用的

MoreArgs=list(min=min, max=max)

采用reduxframework的Zurb Foundation的wp主题无限配色方案

3 个答案: