Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I've just upgraded wordpress to 3.5 version and I noticed that TinyMCE Advanced Editor is not as tall as before.

How can I change default tinyMCE height?

UPDATE

This is the screenshot of section I want to render higher than the default

enter image description here

share|improve this question

4 Answers 4

@frabiacca: I'm not sure if you meant the toolbar menu, like Circle B showed or the height of the writing place. If it's the latter you can :

  • do it easily by gragging the bottom right corner or the textarea or clicking on the fullscreen button of the editor :D

  • do it programmatically

codex.wordpress.org/TinyMCE

function wptiny($initArray){
    $initArray['height'] = '600px';
    return $initArray;
}
add_filter('tiny_mce_before_init', 'wptiny');

but this doesn't seem to work though it should

share|improve this answer

To increase the height of the actual editing area of the WYSIWYG, add this code to the functions.php file:

add_action('admin_head', 'content_textarea_height');
function content_textarea_height() {
    echo'
    <style type="text/css">
            #content{ height:1000px !important; }
    </style>
    ';
}

To show all of the options in the tinyMCE you need to click the Kitchen Sink button:

enter image description here

share|improve this answer
    
I just edited my question by inserting a screeshot of section I want to make higher –  frabiacca Mar 30 '13 at 11:43
    
I've updated the answer... –  Circle B Mar 30 '13 at 13:17
    
it does not work ... maybe because of qtranslate plugin? –  frabiacca Mar 30 '13 at 15:07
    
That could be the case, can you inspect the element in FireBug or Chrome to see whether the style is even trying being applied? –  Circle B Mar 31 '13 at 3:44

If the height of your editor has been changed after using qtranslate plugin (and only in this case), use the code below in your functions.php file :

// fix editor height problem with qtranslate
add_action('admin_head', 'content_textarea_height');
function content_textarea_height() {
    echo'
    <style type="text/css">
        #qtrans_textarea_content_ifr{ height:420px !important; }
    </style>
    ';
}
share|improve this answer

To add all the buttons shown on your screenshot you can set tiny beforehand by specializing the icons you want to see and where, take a look at the source of wp-includes/class-wp-editor.php

You may do something like this (reusing @user29296 proposed answer) by indicating the buttons you want on each lines of the header (i used only a few icons but you can add whatever you need on keys 1, 3 and 4 !! not 2 as it will not show...)

function wptiny($initArray)
{
    $initArray['editor_height'] = '360';
    $initArray['theme_advanced_buttons1'] = 'bold,italic,underline';
    // key 2 won't show, so not needed, hence we use wp_adv to show others by default
    $initArray['theme_advanced_buttons2'] = 'wp_adv';
    $initArray['theme_advanced_buttons3'] = 'justifycenter,justifyright';
    $initArray['theme_advanced_buttons4'] = 'link,unlink,undo,redo';
    return $initArray;
}
add_filter('tiny_mce_before_init', 'wptiny');

In regards to the height of the editor(s), here is a more generic method that would respond to all needs no matter what id or class you apply (also works for an array of textareas)

function admin_custom_css()
{
    $data = '
        .wp-editor-container textarea.wp-editor-area,.mceIframeContainer iframe{
            min-height:360px !important;
        }
    ';
    $data = '<style type="text/css">'.$data.'</style>';

    echo $data;
}
add_action('admin_head', 'admin_custom_css' );
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.