TinyMCE editor width

  • I have been asked by the moderator to open up a new thread.

    I tried all the solutions that I found to change the TinyMCE editor with for the Twenty Fourteen template with no success:
    1. I have edited the editor-style.css file (max-width: 474px;)
    2. I have edited the twentyfourteen/style.css

    Interestingly enough when I change the value temporarily in the Web Developer console, it works however if I make the change in the style sheet, all the values seem to get overridden.

    I am not using a child theme at the moment. I am puzzled.

Viewing 2 replies - 1 through 2 (of 2 total)

  • changes in the width in editor-style.css:

    html .mceContentBody {
	font-size: 100%;
	max-width: 800px;/*474px;*/
}

    only works on the visual editor width;
    it does not actually reduce the editor window, but just reduces what width is used by the content.
    the file is also not loaded when using the ‘text’ setting of the editor.

    if you need to restrict the width of the ‘text’ editor you need to add some code to functions.php of the theme (or child theme);

    example:

    function custom_max_width_text_editor() {
echo '<style type="text/css">
.wp-editor-container textarea.wp-editor-area {
max-width: 580px;
border-right: 1px solid #ddd;
}
</style>';
}
add_action('admin_head', 'custom_max_width_text_editor');

    what actually do you want to change in the layout of the editor?

    Thread Starter ozwest

    (@ozwest)

    Hello Alchymyth

    Thank you for your reply. I only need the visual editor content to be widened up, it is rather annoying at the 474px to work with.

    I took your first suggestion and changed the editor-style.css (which I have done before with no effect) but this time I had 12 hours (sleep) in between and it worked immediately.

    So for anybody reading this … clearing the cache might be a wonderful help.

    ??? One question, if using a CSS style plugin, does that do also an override on the editor-style.css because that would be marvellous.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘TinyMCE editor width’ is closed to new replies.