Monday, March 16, 2020

How do I resize contact form 7 textarea rows?

I see a lot of similar questions in Google:
I used contactform7 to create the contact form for a wordpress site. I want to reduce the rows in a textarea on that form for smaller screen sizes. Is there any method I can use using contactform7's own syntax? If not what are my options?
Below is the syntax for textarea in contactform7 btw:
  1. [textarea* your-message 40x7]
  2. (40 - cols, 7 - rows)
Here is also step by step tutorial it well help you easier to navigate:

You can also type 10x for cols and x2 for rows, if you want to have only one attribute:
  1. [textarea* your-message x3 class:form-control] <!-- only rows -->
  2. [textarea* your-message 10x class:form-control] <!-- only columns -->
  3. [textarea* your-message 10x3 class:form-control] <!-- both -->
By the way you can also try to use this code in your CSS theme file:
(I was able to get this work. I added the following to my custom CSS:)
  1. .wpcf7-form textarea{
  2. width: 100% !important;
  3. height:50px;
  4. }
Hope this helps!

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.