Question

我正在尝试在主题设置中添加一个选项，以使用Redux Framework设置移动菜单的背景颜色。我使用了color_rgba类型，因此我可以选择不透明的颜色。

我在菜单上看到设置了'mobile-menu'类的背景色，但是只有一个十六进制值。

Redux::setSection( $opt_name, array(
    'title'      => __( 'Mobile menu', 'redux-framework-demo' ),
    'id'         => 'header-mobile-menu',
    'subsection' => true,
    'fields'     => array(
            'id'       => 'header-mobile-menu-background',
            'type'     => 'color_rgba',
            'title'    => __('Mobile menu background Color', 'redux-framework-demo'), 
            'subtitle' => __('Background color for mobile menu overlay', 'redux-framework-demo'),
            'default'  => array(
                'color'     => '#E2E2E2',
                'alpha'     => 1
            ),
            'transparent' => false,
            'output'   => array(
                'background-color' => '.mobile-menu',
            ),
        ),

) );

如何确定我得到的是rgba颜色而不是十六进制颜色？

Answer 1

我在单独的PHP文件中处理样式时，没有使用输出来生成样式。但是，我将向您展示我是如何做到的，希望它能对您有所帮助。

我认为也可能是因为您未在设置中使用默认的RGBA值。

这是我的字段数组：

//This sets my redux settings in a variable called options    
$options = get_my_theme_options();

在我单独的php文件中，我这样称呼我的选项名称：

if(!empty($options['the-id-of-my-field-is-here'])) {
    echo'.mobile-menu {
        background-color: '.$options["the-id-of-my-field-is-here"]['rgba'].';
    }';
}

然后我要检查选项中是否有值，是否有值，请按照以下方式使用它：

'default'  => array(
                'color'     => '#E2E2E2',
                'alpha'     => 1,
                'rgba'      => 'RGBA VALUE HERE'
            ),

如您所见，我在最后调用另一个数组，就像 [rgba]

我的猜测可能是尝试尝试或在默认数组中添加RGBA值，如下所示：

{{1}}

我希望这会有所帮助。

Answer 2

基于此参考链接： https://docsv3.redux.io/core/fields/color-rgba/index.html

假设您想输出一种颜色作为背景颜色，而不是颜色。密钥/对格式的以下输出数组将完成此操作：

'output' => array('background-color' => '.site-header')

或者，可以为不同的选择器指定多个元素。

'output' => array(
'background-color' => '.site-header',
'color'            => '.site-footer')

还支持多个选择器。用逗号分隔它们。

'output' => array('background-color' => '.site-header, .site-footer')

如何从Redux Framework的color_rgba-type设置rgba背景色？

2 个答案: