Support » Plugin: GenerateBlocks » Any Way to Disable Color Picker?

  • Resolved stevieboy23

    (@stevieboy23)


    Hi, LOVE the GenerateBlocks, it’s true you can build pretty much any layout with these blocks.

    However we use a very restricted color palette. Is there any way, perhaps via our functions.php we can hide the color picker in the Editor (the div with class “.react-colorful”? Many Thanks

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Support fernandoazarcon2

    (@fernandoazarcon2)

    Hi @stevieboy23,

    You can do so by enqueueing your own style in the Block Editor.

    For instance, in your Child Theme directory, you create a new file called my-editor-style.css

    Then, add this PHP in functions.php:

    add_action( 'enqueue_block_editor_assets', function() {
    	wp_enqueue_style( 'my-block-editor-styles', get_stylesheet_directory_uri() . "/my-editor-style.css", false,'1.0', 'all' );
    } );

    Your my-editor-style.css should have this code:

    .react-colorful {
    	display: none !important;
    }

    Hope this helps!

    Thread Starter stevieboy23

    (@stevieboy23)

    Hi, thanks for replying.

    I already have editor-styles enqueued, and .react-colorful {display: none !important;} in my css was the first thing I tried. Unfortunately the color picker still appears, stubbornly refusing to display:none …

    Plugin Support fernandoazarcon2

    (@fernandoazarcon2)

    Can you right click and inspect while editing a page, and check if my-block-editor-styles is really enqueued? Example: https://share.getcloudapp.com/04uQE0nJ

    If it is, can you check if the CSS is implemented?: https://share.getcloudapp.com/KoujAyRz

    If it’s implemented and something is overwriting it by precedence, try adding selectors to the CSS code to exceed the precedence of the other CSS rule.

    Kindly let us know.

    Thread Starter stevieboy23

    (@stevieboy23)

    Hi, Yes, I already have a sizeable editor-styles.css that loads my styles for the backend. But it seems to have no effect with .react-colorful. I guess I’ll just have to live with it. Anyway, GenerateBlocks is still a brilliant plugin!

    Plugin Support fernandoazarcon2

    (@fernandoazarcon2)

    If you’re not seeing the code:

    .react-colorful {
    	display: none !important;
    }

    applied to the color picker, there may be a syntax error somewhere in your style sheet.

    Try adding a basic CSS code below the code above and see if it will work. Something like to test:

    p, h1, h2, h3 {
    	color: green !important;
    }

    If it doesn’t work as well, then there’s a syntax error somewhere in the stylesheet.

    Hope this clarifies!

    Thank you for the compliment!

    Thread Starter stevieboy23

    (@stevieboy23)

    I knew there was nothing wrong with my css file as it was loading my styles, but I added your code just to check…

    Anyway as this image shows: https://andystewart.info/colorful.png .react-colorful still persists – So, I guess I really will have to live with it! Best Wishes.

    Plugin Support fernandoazarcon2

    (@fernandoazarcon2)

    I see. That’s odd.

    If you inspect the color picker, can you see the code as such?: https://share.getcloudapp.com/E0uyZd2v

    Perhaps you can try a different CSS selector?

    Plugin Support fernandoazarcon2

    (@fernandoazarcon2)

    Hi there! We haven’t heard back from you for a while now so we’re going to go ahead and set this topic as resolved. Feel free to reply if you need any more help.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Any Way to Disable Color Picker?’ is closed to new replies.