Edit Page font color too light

[Roland]

A:

Is there a way for us to change the default font color for the text that appears on the Edit Page? Specifically, changing it to #000000

~R

WPEditor2.png

Attachments:

You must be logged in to view attached files.

[Sushil Adhikari]

it would be the editor-style.css file that can control that. The colour set should be the same for the front of the site which is #656565. You would have to edit that or if you are using a child theme, it’s better to create an editor-style.css to override the colour.

[Roland]

A:

Tried the first option:

background-color: transparent;
border-collapse: collapse;
border-spacing: 0;
}

/* 03 Base CSS
-------------------------------------------------------------- */
html {
	height: 100%;
}

body {
	-moz-font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	background: #ffffff;
	color: #000000;

But that didn't take.

So then I tried option#2:

add_action( 'init', 'cd_add_editor_styles' );
/**
* Apply theme's stylesheet to the visual editor.
*
* @uses add_editor_style() Links a stylesheet to visual editor
* @uses get_stylesheet_uri() Returns URI of theme stylesheet
*/
function cd_add_editor_styles() {
 
add_editor_style( get_stylesheet_uri() );
 
}

:-\

What am I missing?

[Sushil Adhikari]

I just tried this with my local test site using the child theme for Celestial Reloaded. I created a new css file in the child theme:

editor-style.css

Then inside that I added:

body {
color: #000;
}

That worked.

[Roland]

When you say you “created a new css file in the child theme” do you mean a folder in the WordPress folders or did you do this via the theme itself?

Orrrrrrrrrrrrrr are you saying you opened the Child Theme’s zip folder, added to that the new “editor-style.css” saved it, zipped it and then uploaded that newly modified child theme?

[Sushil Adhikari]

simply made an empty file named: editor-style.css and used my ftp to upload this to where the style.css file shows up in the child theme.

[Roland]

“Hmmmmm,” I say.

Couldn’t we just custom-css it, by using code that says in essence to have the editor-style css follow the color we pick in the Customizer? Probably more work that way, eh?

So if not that . . . why do you suppose I couldn’t get the hard-coding in the Parent theme to work?

Many thanks as always, Andre

[Sushil Adhikari]

Unfortunately the only 2 options you have are:

1. edit the original editor-style.css directly (but you lose the changes with theme update)
2. If using a child theme, doing the upload of a custom editor-style.css file with the body color of text that you want

The editor styles do not inherit the actual theme styles, which is why there is a special css file for the editor view.
You could change the parent theme’s editor-style.css file if you want, but each time a theme update is done, you will have to change your colour of text back to what you want.

[Roland]

Yeah, but I tried #1 and that didn’t take, either.

:-\

[Sushil Adhikari]

I discovered something… I have two colors in the body part of the editor-style.css file. One is for #656565 and the other (which is overriding that one is #848484

Remove one of those and try again with your own colour; should just be one there.

[Roland]

That’s It!

It was the #848484 color that needed to be changed.

I changed that to #000000 and now it matches the font color used in the site

Many thanks, A.

~R

[Sushil Adhikari]

Glad to hear… albeit it was my fault for having two colours….ooops! :whistle:

[Roland]

“Shhhhhhhh, no one will ever know.” 😉

[Author]

Posts