Posted 2 years ago #
I've been looking everywhere for this, but I can't believe I'm the only one who wants this, so I must probably be blind or dumb.
Anyway, what I want is to be able to style the post editing area in the WP admin area with CSS, so that when I write or edit a post, I have the same fonts, the same width and the same image styling as on the front. But I can't seem to find the CSS-file that controls this.
So basically, can anyone tell me what file(s) style the post editing area?
when I write or edit a post, I have the same fonts, the same width and the same image styling as on the front.
With which theme? Or so you intend to change this CSS every time you change themes? And will your front facing theme always have the same number of columns as the Admin Post/Page editing interface? If not, any styling is still likely to be pretty hit-and-miss at best.
As far as I know, the styling for the general Admin area is in wp-admin/wp-admin.css but the styling for the WYSIWYG editor is likely to be in wp-includes/js/tinymce/themes/advanced/skins/.
Posted 2 years ago #
I have a customized theme, and I don't intend to change it in the foreseeable future, so all font-attributes and image-attributes is pretty predictable. I also have a fixed column-width for 95% of the text on the site, and it will never be wider, so I would want to limit the width in the so-called WYSIWYG editor as well. The problem is, as long as all attributes is different when I edit, What I See Is Not What I Get...
I've tried to tweek all the css-files I can find in the tinymce-folder, but I can't seem to find the right one.
I've have already accomplished what I want by changing a line in the TinyMCE Advanced Plugin (See this topic), but the plugin have some unwanted effects in IE7, so I want to find the CSS that controls the regular TinyMCE to avoid that.
Anyone know for sure?
Posted 2 years ago #
Baardvidar
You are not alone on this one as I need a more WYSIWYG in my Post Editing Area. Let me know if you find a solution and I will do likewise.
Also unbelievable no one else appears to want this...
Cheers
PV
Posted 2 years ago #
I believe what you are looking for is to go into wp-admin/wp-admin.css and change/add
#editorcontainer { your settings }
#editorcontainer is the wrapper around the textarea in post-new.php and post.php, and #editorcontainer #content is the textarea.
Posted 2 years ago #
No, I don't think the settings are in wp-admin.css. I changed all the fonts in there to Verdana (which i use on my posts), and everything but the text area was changed to Verdana.
I suspect the css controlling the text area is in the tinymce-folder, somewhere. According to my Firebug the css controlling my text area is body.mceContentBody in the content.css under wp-includes>js>tinymce>themes>advanced>skins>wp-theme. But when I change the css, the changes doesn't appear in Firebug.
To be more precise, Firebug says the css-file is content.css?ver3241-11410. Is this some kind of caching? I don't use any caching plugins, but it seems the file doesn't change in the browser.
Posted 2 years ago #
And, will do, Peevee!
Posted 2 years ago #
OK, I finally found it. The wp-includes>js>tinymce>themes>advanced>skins>wp-theme>content.css, I mentioned earlier, is the one for me at least.
For some reason the css was cached and didn't change when I uploaded new code to the file. That's why it was so hard to find. But clearing the browser cache fixed that.
Posted 2 years ago #
I'm wondering if anyone found how to make the TinyMCE text area, fixed width?
Posted 1 year ago #
@darinm: I just searched for and found how to set the height of the TinyMCE post content editor and so it should probably work the same for width, try this which should set the width the 500px:
add_filter('tiny_mce_before_init','my_tiny_mce_before_init');
function my_tiny_mce_before_init($options) {
$options['width'] = '500px';
return $options;
}Hope this helps?
-Mike
This topic has been closed to new replies.
