Resizing the width of the WYSIWYG editor

Just a simple question here but though my googling and searching efforts haven’t found the answer to it. I’m wanting to re-size the width of my WordPress WYSIWYG editor to be 650px. What do I have to type into functions.php to get this effect?

I found this but it didn’t do anything

add_action('admin_print_styles-edit.php','increase_textarea_css');
add_action('admin_print_styles-post-new.php','increase_textarea_css');

function increase_textarea_css() {
    ?>
    <style type="text/css">
    textarea#content { width:650px!important; }
    </style>
    <?php
}

2 Answers
2

The WYSIWYG uses the .wp-editor-container class. So the easiest way would be to change this in your CSS. If your style is being overwritten then just add !important.

.wp-editor-container {
    width:50%; // What ever size you want
}

the wp_editor() function also allows us to add a class to the textarea tag, I’m not sure if this might help you. Here’s how though:

<?php wp_editor( $content, $editor_id, $settings = array( 'editor_class'=>'yourclass' ) ); ?>

You can take a look at the documentation here: wp_editor – Codex

Leave a Comment