NO BUG: Gutenberg editor styles disappear after GenerateBlocks plugin activation

[Richard]

Hi,

I’ve run into an issue where the post editor styles disappear when I activate the GenerateBlocks plugin alongside Bricks. I’ve tested GB with a few other themes without any such problem. Below are the before/after screenshots on a clean WP install with only the latest versions of Bricks and GB installed.

Gutenberg editor before activating GenerateBlocks:

Gutenberg editor after activating GenerateBlocks:

I’ve contacted GB support first, because the issue started after a recent GB update. Suggesting the problem is within their plugin. However they looked into it and are at a loss why this conflict occurs, asking if I could contact Bricks support for some insight how the Bricks editor styles are inserted. See this quote from GB support:

Ok, so we tracked this down to this filter we added to the GenerateBlocks plugin:

generateblocks/includes/general.php at 08a4b5b6e146acf1deb36d182d74556b7f71809d · tomusborne/generateblocks · GitHub

Which is just a CSS reset that GB requires to remove the editor margins from our blocks.

The block_editor_settings_all filter we are using is a core filter hook that is built for this kind of thing, and we use this throughout GP and GB with no previous issues.

Now, we looked inside the Bricks theme to see if it was using that same filter hook and if there was any possible cause for conflict. What we discoverd is they do not use that filter.
So we are not sure how they are inserting their code in the editor and therefore completely at a loss of how this filter in GB would affect that.

For reference we have a GitIssue on GB plugin open here:

GB 1.9 "interupts" editor styles in Bricks theme. · Issue #1232 · tomusborne/generateblocks · GitHub

Could you raise a support topic with Bricks to see if they can shed some light on this ?

Link to the GB support thread: Topic: Post Editor styling changed after updating to GB 1.9 and GB Pro 1.7 - GenerateSupport

Thanks,
Richard

[charaf]

Hi @Richard,

Thank you for your detailed report,

This issue appears to be associated with GenerateBlocks, as Bricks does not inject special CSS styling into the block editor. The problem likely arises from the generateblocks_do_block_css_reset function included in GenerateBlocks, which overrides the default styling with:

add_filter( 'block_editor_settings_all', 'generateblocks_do_block_css_reset', 15 );

function generateblocks_do_block_css_reset( $editor_settings ) {
	$css = '.gb-container, .gb-headline, .gb-button {max-width:unset;margin-left:0;margin-right:0;}';

	$editor_settings['styles'][] = [ 'css' => $css ];

	return $editor_settings;
}

I’m not sure why this is occurring, but it’s worth noting that even if you test with a freshly created, minimal theme, you will encounter the same issue. You won’t experience this problem with the latest default WordPress themes because they enqueue their own styling into the block editor.

I hope that helps, and please let us know if there’s anything else we can assist with.