Archived topic
Dark background in desktop editor - white background in tablet and mobile editor
7 replies · Started by Marie on March 22, 2022
Hello Generatepress team,
I have a trouble with the color of the editor background.
My website's background is black.
When I edit the post or page, it's ok when I edit in desktop. But if I want to edit the tablet or mobile version, the background is white (and the text white too).


I try to add the snippet :
add_action( 'enqueue_block_editor_assets', function() {
$css = 'body.editor-styles-wrapper{background-color: #171717;}';
wp_add_inline_style( 'generate-block-editor-styles', $css );
}, 100 );
But it does'nt work.
Can you help me.
Thanks.
Marie
Hi there,
can you confirm you're using the latest version of the Theme and GPP Plugin ? As I thought we had patched the issues WP 5.9 introduced with their updated responsive views. Let me know
Yes I confirm. I have GP 3.1.3 and Premium 2.1.2
Hmm... we'll take a look into this.
Try using this snippet:
add_filter( 'block_editor_settings_all', function( $editor_settings ) {
$css = 'body{background-color: #171717;}';
$editor_settings['styles'][] = array( 'css' => $css );
return $editor_settings;
} );
Yes it works.
Thank you very much.
You're welcome.
We'll take a look into whats going on there :)
Hi David.
I had had this behavior as well. And yes, still with the neweset version of GP (3.2.3 & 2.2.1) and WP (6.1). ;)
With your snippet it works perfectly for me too. Thanks a lot for that.
Since the last updates of GP it seems that an "!important" or a better selector is needed. Otherwise the background in the mobile view fades to light again.
I also used the color by variable from my global colors. If the background ever changes, the editor changes right away too.
body{background-color: var(--contrast) !important;}
Glad to hear that worked for you too! and thanks for sharing your method.
I thought this had been resolved, so we'll take another look if 6.1 made more changes.