Site logo

Archived topic

Lock down custom color palette / disable color picker

4 replies · Started by ic7 on November 1, 2019

Viewing posts 1–5 of 5

Hi,

is it possible to lock down the custom color palette added by the 'generate_default_color_palettes' filter by disabling the color picker? Just like 'add_theme_support( 'disable-custom-colors' );' that's available for the block-editor.
This locks the custom color palette and removes the possibility to choose additional random colors via the color picker.
Can the above mentioned filter be extended for this functionality?

Thanks for your help!

Kind regards,
Sebastian

Hi there,

So only the colors in the palette are visible? I'm not sure if this is possible right now, but it's a good idea.

I'll see what I can do and will get back to you ASAP :)

Hi there,

Not sure how well it will work, but give this a shot:

add_action( 'customize_controls_print_styles', function() {
    ?>
        <style>
            .customize-control-gp-alpha-color .iris-square, .customize-control-gp-alpha-color                 .iris-slider {
                display: none;
            }

            .customize-control-gp-alpha-color .iris-picker {
                width: auto !important;
                height: auto !important;
                padding-bottom: 0 !important;
            }

            .customize-control-gp-alpha-color .iris-picker-inner {
                position: relative;
                height: 40px;
            }
        </style>
    <?php
} );

Hi Tom,

thanks for pointing me in the right direction!
The following code got me closest to what I wanted to achieve:

// GP - HIDE CUSTOM COLOR PICKER & INPUT
add_action( 'customize_controls_print_styles', function() { ?>
<style>
	.wp-picker-container .iris-square, 
	.wp-picker-container .iris-slider, 
	.wp-picker-container .wp-picker-input-wrap label,
	.wp-picker-container .wp-picker-input-wrap input {display: none;}
	.wp-picker-container .wp-picker-input-wrap {width: 275px; height: 0;}
	.wp-picker-container .iris-picker {width: auto !important; height: auto !important; padding-bottom: 0 !important; margin-top: -16px;}
	.wp-picker-container .iris-picker-inner {position: relative; height: 8px;}
</style>
<?php
} );

Awesome, glad I could help :)

This archived topic is closed to new replies.