[chrissiec]

chrissiec

#9299

Hi, I’m having problems trying to expand the message box in my form on my contact us page Have checked different methods but stays as default one line. Can you help please. Website is http://www.laheat.co.uk. Thanks

[Kenneth John Odle]

Kenneth John Odle

#43282

Quote:

Have checked different methods

What are these methods? I don’t want to waste my time or yours suggesting something you’ve already tried.

But first, have you checked the plugin documentation and support channels?

[Anonymous]

Anonymous

#43283

When using the Firefox feature “Inspect Element” (right click) it changes the box size when editing the following height and width values:

Element {

width: 300px;

height: 300px;

}

So I’d say you could add this code to your child theme’s style.css file. Change the sizes to whatever you prefer.

[chrissiec]

chrissiec

#43284

Hi

I’ve tried entering the below within the Contact form 7 plugin area in worpress

<p>Your Message

[textarea your-message 300x50] </p>

and also adding the below to CSS

.wpcf7 textarea  {

height: 300px;

width: 50px;

}

but the row length changes but not the height so I only get a single line and would like multiple lines like a box area for people adding a message

If you visit http://www.laheat.co.uk/contact-us/ you can see what I mean

[Anonymous]

Anonymous

#43285

Did you try the code I posted?

[chrissiec]

chrissiec

#43286

Yes I entered the code below

.wpcf7-textarea {

width: 300px;

height: 300px;

}

but made no difference. The message box will drag out but I want it fixed as a multiple row box. Any help appreciated

[Anonymous]

Anonymous

#43287

Hi there Chrissie,

Try putting this into your child theme / custom CSS:

textarea.wpcf7-form-control.wpcf7-textarea {

height: 300px;

width: 300px;}

Obviously you can change the width / height elements to whatever you need them to be. Just a heads up that you can use Firebug extension for Firefox to isolate elements such as this. If you’re not familiar with how to use Firebug, Josh Lobe has some great tutorials.

Part One is here, Part Two is here and Part Three is here.

Hope that helps 🙂

Regards,

Sharon

[Kenneth John Odle]

Kenneth John Odle

#43288

@chrissiec:

Put code in between backtick (

Code:

`

) characters. It’s usually located above the Tab key on your keyboard. Or use the “code” button.

Does the plugin have a setting for cols? Which plugin are you using, and again, have you checked the plugin documentation?

Try switching to the default 2014 theme. If the problem still exists, this is a plugin issue, not a Graphene issue.

[chrissiec]

chrissiec

#43289

I checked the 2014 theme and it was ok in that theme but not in graphene but I’ve changed to the code Sharon supplied and that seems to have done the trick, thanks for your help, really grateful

[Kenneth John Odle]

Kenneth John Odle

#43290

Marking thread as resolved. You can do this yourself as well.