contact form field

  • 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

    Mod

    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

    #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

    #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

    #43285

    Did you try the code I posted?

    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

    #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

    Mod

    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

    #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

    Mod

    Kenneth John Odle

    #43290

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

Viewing 10 posts - 1 through 10 (of 10 total)

  • You must be logged in to reply to this topic.