Remove inline styling from gutenberg block gallery

Question

I have updated my wordpress and it now displays the following CSS on my page:

<style> .wp-block-gallery-1{ --wp--style--unstable-gallery-gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) ); gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )}</style><style> .wp-block-gallery-2{ --wp--style--unstable-gallery-gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) ); gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )}</style><style> .wp-block-gallery-3{ --wp--style--unstable-gallery-gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) ); gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )}</style><style> .wp-block-gallery-4{ --wp--style--unstable-gallery-gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) ); gap: var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )}</style>

I did some research and got to the wp-includes/blocks/gallery.php file and added it here:

add_action(
    'wp_footer',
    function () use ( $style ) {
        echo '<style> ' . $style . '</style>';
    }
);

But I don't know how to remove it from the functions.php of my theme.

How can I remove it? I have searched everywhere and found no solution.

Answer 1

I've located the issue in wp-includes/gallery.php in block_core_gallery_render function. Wordpress sets the style in there, the inline notes mention that it should be loaded in the head but that it's loaded in the footer for now. (Sounds like they aren't happy with it either) I didn't want to touch the WP core so I think I found a solution.

Add this to your functions.php:

remove_action('init', 'register_block_core_gallery');

This should remove the style blocks like wp-block-gallery-1, wp-block-gallery-2, etc.

Let me know if that worked for you!