Support » Themes and Templates » How can I make the textarea for content and pages wider?

  • Hi Everyone,
    Dealing with what should be a very easy problem; for whatever reason, I’m struggling with it…

    I personally find the content textarea too narrow for my liking. In the admin panel, it seems fairly easy to add more rows, but there doesn’t seem to be a simple way to add colums. In fact, this seems to be ignored because the textarea is defined by a style, like so:

    <textarea rows="<?php echo $rows; ?>" cols="10" name="content" tabindex="5" id="content">

    In the stylesheet for my theme, the content class is defined to be just 510px wide. The content class is also used to style the content layout on the page view as well.

    Here’s where it gets a bit tricky. If I create a new class, say content1, and give it the exact same elements that are in the content class, then it works (which means I can increase the size to whatever I want). However, for whatever reason, the quicktags fail to work using this new style!

    My only option is to increase the width defined in the content class, but that will impact how the content is styled on the front end. Considering WordPress wraps each paragraph element inside brackets, it shouldnt really matter for the input and display elements to be the same width correct?

    Or am I missing something here?

    Thanks for your help.


Viewing 15 replies - 1 through 15 (of 21 total)
  • When to talk about the “content textarea” – does it mean the “window” in the admin panel where you write your posts? I don’t know what resolution do you have, but at 1027×768 the text input area is big enough. If it was wider would push the categories sidebar out of the screen.

    Me thinks you are crossing up two different contents. IT sounds to me like at first you are talking about the content box you type your post in, then you talk about the content of your finished post, as you reference your THEME’S style sheet. The two do not have anything to do with one another. If I’m mistaken, can you clarify?

    Slight correction here, though I’m still confused.

    Looking through my theme, which is Connections, the content is actually styled using the post-content class.

    However, when I modified the content class, the modifications were reflected on the front end website as well as on the form pages. But if the web display is referencing the post-content class, then why did it pick it up?

    The only thing I can see that might cause the this is that the two classes are referenced in the stylesheet differently. I don’t really know what it means, but here are the two references:

    #content {

    .post-content {
    padding:10px 0;
    margin:3px 0;
    border-top:#BBC4A3 1px solid;
    font-family: Georgia, Verdana, Arial, serif;

    Does the hash key act as some sort of wildcard? Like any class that contains the word ‘content’ will also utilise these attributes??

    Thanks All,


    the # means a div, the . means class. You are only suppose to have one of the divs per page, as many classes as wanted.

    When you say forms then, are refering to the comments form then?

    Actually, we are the ones confused 🙂
    textarea is a very specific expression used for defining a certain part of a form in a webpage. Click to see it.

    It seems you are not talking about the textarea but about the content part of your theme. You cannot make it wider without re-designing the theme: the whole theme has to be wider in order to allow a wider content.

    Ok, so I’m not doing a good job explaining myself.

    The textarea, refers to the form you use to create and edit content.

    Whenever I talk about the ‘front end’, I refer to how the content appears on the site.

    The content as it appears in the site, is inside a div with a class of “content-post”.

    The textarea where you input the content, is in a class called “content”.

    As I’m self taught on CSS, I’m confused why changing the atrributes for the “content” style, which should only affect the textarea of the form, also impact how the content styles in the “content-post” class.

    Does that make sense?


    You still don’t get it 🙁
    Do you want to change the frontend or the backend?
    They are NOT related.
    They use different stylesheets.
    Don’t even mention “textarea” if you want to change the frontend.

    I do get it. The title of the post says it all, I’m looking to modify the textarea you use to input your content.

    All I’m looking to do is change the width of the textarea, which I mention above.

    I am confused, because not only is the change reflected in the textarea (ie the form), which is what I wanted, but it is also shows up on the website in terms of how the content is displayed, which is what I don’t want.

    Both stylesheets are referenced in the admin screen, and both stylesheets contain a class called “content”. Strangely enough, if I change the content class in the admin css, it does nothing.

    The content is displayed on the site inside a div that references a class called “post-content”. So again, I am confused why chaning a differently named class would have any affect.

    I am new to this thread and I still don’t think I get it ;-), changing, in admin.css,

    classwhatever { whatever }

    will have no effect on how the content is displayed on the front page. That is, unless you define a class and use it in both the content div and in the textarea, and mistakenly call admin.css in the front page, then there will be a possible conflict between the two.

    I know, I don’t get it myself, hence the reason for this post.

    I changed the class for the textarea, in the admin pages, and the change was reflected. However, it also changed the way the content was styled on the site!

    Then I created a new class, and changed the textarea to reference it. The textarea did change, however the quicktags stopped working.

    Its all very weird….


    I’d sooner believe your eyes are playing tricks. Unless you call admin.css in your index page, then what you describe (or how I interpret what you describe 😉 is as likely as turning on the bathroom light causes my car to start.

    Its the other way around.

    I’m making the changes in the site stylesheet, not the admin one. I mentioned this above, but for whatever reason when I made the change in the admin stylesheet (for the textarea), it didn’t change.

    Both the admin stylesheet and the site stylesheet have a class called “content”.

    Its the other way around.

    I’m making the changes in the site stylesheet, not the admin one. I mentioned this above, but for whatever reason when I made the change in the admin stylesheet (for the textarea), it didn’t change.

    Both the admin stylesheet and the site stylesheet have a class called “content”.

    All right, so turning on my car causes the bathroom lights to turn on 🙂 I guess I’d better reread the entire thread… after church.

    It’s a longshot but make sure the theme you are using does not add css to the admin section. Check the source, wp-admin.css should be the only one called.

    Your working on the sabbath? You heathen! 🙂

    I mentioned it earlier in the thread, but my theme does call the site stylesheet in the admin pages.

    As its done in the header, I’m not sure how to disable it just in the admin pages….

Viewing 15 replies - 1 through 15 (of 21 total)
  • The topic ‘How can I make the textarea for content and pages wider?’ is closed to new replies.