Topic: Single post block editor area is grayed out

nest9
April 23, 2024 at 4:05 am

Hi,

After the latest WordPress update, the block editor area of WP is grayed out, and the fonts of the theme are not loading there as well. Can you please suggest a fix?
David
April 23, 2024 at 5:15 am
Hi there,

If you edit a Post, and Right Click > Inspect the editor to open the browser developers tools.
In the Console tab you will see this Warning:
```
wp.blockEditor.transformStyles Failed to transform CSS. <css input>:2:19: Unknown word
  1 | .lp-letter-banner-h2 {
> 2 | 	margin-top: 0px; !important
    | 	                 ^
  3 | }
  4 | .lp-ib-paragraph {
```
This is WordPress trying to parse the Customizer CSS that you are loading in the editor.
And its failing because the following CSS is wrong:
```
.lp-letter-banner-h2 {
	margin-top: 0px; !important
}
.lp-ib-paragraph {
	margin-bottom: 0px; !important
}
```
Those !important statements must come before the ;

ie.
```
.lp-letter-banner-h2 {
	margin-top: 0px !important;
}
.lp-ib-paragraph {
	margin-bottom: 0px !important;
}
```
That will make the CSS valid and WP should now load that and the other editor CSS without issue.
nest9
April 29, 2024 at 10:28 pm

Hi,

Thank you for looking into it. I have fixed the CSS code as instructed, but the issue remains. Changing the theme to the default WP theme seems to resolve this issue. I have recorded a short video demonstrating the issue. Would you mind taking a look at it?

https://cln.nest9.com/XjQwsmnd

Many thanks.
Alvind
April 29, 2024 at 11:08 pm

Hi there,

Your CSS is still incorrect. See here: https://postimg.cc/BtPBnj44

Make sure to remove the ; after 0px.
nest9
April 29, 2024 at 11:22 pm

I see. Even though, the issue is still there. We tried removing complete custom CSS, as shown in the video, and the issue was still there. It only goes upon switching the theme. The CSS has been corrected too.
Alvind
April 29, 2024 at 11:35 pm

Okay, this topic has some issues similar to yours. Could you try the suggestions that David outlined here?https://generate.support/topic/grey-background-gutenberg/#post-103220
nest9
April 30, 2024 at 12:25 am

Perfect! It solved the issue. Thanks
Alvind
April 30, 2024 at 5:27 pm

No problem!

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

Single post block editor area is grayed out