Global Color Palette

Hey guys,

This would be for both GenerateBlocks Pro and GeneratePress (maybe it’s a GP Premium feature that detects if you are using GenerateBlocks Pro)?

Basically a global color palette that would allow users to easily update master colors. This would be really helpful for websites that are pre-designed and just need color tweaking to change the look quickly.

It would need to be something that would force the updates across both GenerateBlocks Pro and GP Premium.

Global colors would be able to be set in Customizer and be used in Global Styles.

Thoughts?

7 Likes

Hello Clayton,

it would be much easier if it is was included in the Global Styles. but as for now you can use this code to create Gutenberg color palette ( it includes GenerateBlocks as well ).

add_action( 'after_setup_theme', function() {
    add_theme_support( 'editor-color-palette', array(
        array(
            'name'  => __( 'Jasmine' ),
            'slug'  => 'jasmine',
            'color' => '#FFDB83',
        ),
        array(
            'name'  => __( 'French Bistre' ),
            'slug'  => 'frenchbistre',
            'color' => '#8B6E4B',
        ),
        array(
            'name'  => __( 'Umber' ),
            'slug'  => 'umber',
            'color' => '#5F4D3B',
        ),
        array(
            'name'  => __( 'Jet' ),
            'slug'  => 'jet',
            'color' => '#2E2E2E',
        ),
        array(
            'name'  => __( 'Raisin Black' ),
            'slug'  => 'raisinblack',
            'color' => '#282627',
        ),
        array(
            'name'  => __( 'Spanish Gray' ),
            'slug'  => 'spanishgray',
            'color' => '#9D9D9D',
        ),
        array(
            'name'  => __( 'Gainsboro' ),
            'slug'  => 'gainsboro',
            'color' => '#E1DFE1',
        ),
    ) );
} );

you can find the original code here by Tom:

1 Like

Thanks @AbdullaAlSinani! I’ve used this in the past and it does seem to work well. I’ll see if it works to update an existing color within the customizer. That’s the main issue I’ve run in to.

As far as I know, this sort of this requires CSS variables. It’s something we’re looking at in GP at the moment. Once we have a system in place there, we’ll also add it to GB and connect the two :slight_smile:

4 Likes

Amazing! Can’t wait. I’d be happy to be a beta tester if you need them.

1 Like

When adding to code snippets or child themes functions.php, the color-palette in Customizer remains unchanged

1 Like

It’s quite clunky issue by now :confused:
The snippet above gives you a color palette in block editor.
Use this to set colors in the Customizer.
However, we still don’t reach palettes in other settings, e.g. plugins.

You may use a plugin that offers global colors (but I haven’t found a good enough in sake of performance and flexibility).

From my point of view a solution should consider, that global color palettes management is with some other themes already (in the customizer). Management of colors should be left with them in that cases, to ensure GenerateBlocks works seamless with other themes

Using logic I bet they could do both. Detect if they are using GeneratePress as the theme and if so the global color pallet kicks in. I believe they are working on a solution already.

Making awesome progress on this :slight_smile:

4 Likes

Can’t wait! Let me know if you need beta testers.

1 Like