The footer background color field doesn't

[mohammedeisa]

Steps to reproduce:

• On the demo options page
• Go to Color selection > Color > Footer Background Color
• Select a color
• See that the color is not applied in the Twenty Twenty One footer

[mohammedeisa]

The same issue happens on Redux 4.1.24

[essamamdani]

I check everything from my side...it works fine as you suggest. if it is not working let me know how to reproduce it

[mohammedeisa]

@essamamdani here is a video showing the issue:

https://user-images.githubusercontent.com/3139496/119422392-3fec4d80-bd01-11eb-83cb-c79b585b1fcf.mp4

As you see at the end of the video, the footer doesn't have the red background.

[kprovance]

array(
    'id'       => 'opt-color-footer',
    'type'     => 'color',
    'title'    => esc_html__( 'Footer Background Color', 'your-textdomain-here' ),
    'subtitle' => esc_html__( 'Pick a background color for the footer (default: #dd9933).', 'your-textdomain-here' ),
    'default'  => '#dd9933',
    'validate' => 'color',
    'output'   => array( '.footer' ),
),

I assume this code in the sample-config has not changed? Here's the problem(s).

1) This code was originally written for Twenty-Thirteen or Twenty-Fourteen, and the class name has changed (or no longer exists). For Twenty-Twenty, it's footer (with no class prefix as it's a tag, or alternatively the ID #site-footer).

2) The default output when not specifying an array with attributes is color and not background-color. You'd have to add a mode key pair and set it to background-color. But that's the 'old way' of doing it. I'd just change the output key pair to:

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

[kprovance]

Fixed in the latest pull request, 4.1.27

[mohammedeisa]

@kprovance This doesn't work on 2021 theme using the zip archive provided by @arturgrabo . The footer of the 2021 stays with no background color after setting a background color from the sample options.

[mohammedeisa]

Also, the Header Gradient Color Option* field doesn't work.

Do I misunderstand how these colors work?

[kprovance]

The 2021 theme probably has a new class name that needs to be added to the output array of the sample config. They seem to change with every new version. I only tested it with 2020. I'll check again. I have no idea what you mean by gradient header. To which field in the sample config are you referring?

[kprovance]

Also, the Header Gradient Color Option* field doesn't work.

Do I misunderstand how these colors work?

If I understand correctly, the color-gradient field does NOT output gradient CSS unless Pro is active. It never has. It was always up to the dev to use the output variables and apply gradient how they chose.