WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
Changing Field Size (5 posts)

  1. galtmilemediagroup
    Member
    Posted 1 year ago #

    We installed the contact form 7 plug in onto a client website apriorilimo.com. The field sizes are still too big. I went to edit the contact form by adding the size 10 and pasting the tag that was generated for that field. The size of the field is not getting smaller.

    Am i missing something? Why isn't the field size changing?

    Below is one of the tags generated for the field First name.
    [text* FirstName 10/ class:required]

    Below is the full code for the full reservations form using contact form 7:

    <fieldset>
    <LEGEND class="style1"><strong>Contact Information</strong></LEGEND>
    
      <label>First Name:</label>
    [text* FirstName 10/ class:required]
    
      <label>Last Name:</label>
      [text* LastName 8/id:Last_Name]
    
      <label>Phone Number:</label>
     [text* PhoneNumber 8/]
    
      <label>Email Address:</label>
     [text* EmailAddress 8/]
    
      </fieldset>
    <fieldset>
    <LEGEND class="style1"><strong>Reservation and Vehicle Type</strong></LEGEND>
    
    <label>Reservation Type:</label>
    [select* ReservationType "Select from" "Airport (FLL)" "Airport (MIA)" "Airport Roundtrip" "Port Everglades" "Port of Miami" "Galleria Mall" "Las Olas" "Sawgrass Mall" "Business" "Luncheon" "Sporting Event" "Nightout"]
    <label>Vehicle Type:</label>
    [select VehicleType "Select from" "Stretch Limo 6 Passenger" "Stretch Limo 10 Passenger" "Passenger Black SUV" "Black Lincoln Towncar 10 passenger" "White Lincoln Towncar 10 Passenger"]
    </fieldset>
    <fieldset>
    <LEGEND class="style1"><strong>Departure Trip Pick-Up</strong></LEGEND>
    
      <label>Date of Pick-Up:</label>
      <input name="Pickup_Date" type="text" />
    
      <label>Pick-Up Time:</label>
      [text* Pick-UpTime]
    
      <label>Pick-Up Location:</label>
      [text* Pick-UpLocation]
    
      <label>Drop-Off Location:</label>
      [text* Drop-OffLocation]
    
      <label>Number of People:</label>
    [select* NumberofPeople "Select from1" "2" "3" "4" "5" "6-10" "11-15" "15-20" "20+"]
    
      <label>Airline Name:</label>
      [text* AirlineName]
    
      <label>Flight Number:</label>
      [text FlightNumber]
    
    </fieldset>
      <fieldset>
    <LEGEND class="style1"><strong>Return Trip Pick-Up</strong></LEGEND>
    
      <label>Date of Return:</label>
      [text DateofReturn]
    
      <label>Time of Return:</label>
      <p>
       [text TimeofReturn]
      </p>
      <label>Pick-Up Location:</label>
     [text Pick-UpLocation]
    
      <label>Drop-Off Location:</label>
      [text Drop-OffLocation]
    
      <label>Number of People:</label>
    [select NumberofPeople "Select from" "1" "2" "3" "4" "5" "6-10" "11-15" "15-20" "20+"]
    
      <label>Airline Name:</label>
      [text AirlineName]
    
      <label>Flight Number:</label>
     [text FlightNumber]
    
      </fieldset>
      <label>Comments/Special Request</label>
      [textarea Comments]
      <label> </label?
    
    <p>[submit "Send"]</p>

    [Moderator Note: Please post code or markup snippets between backticks or use the code button. Or better still - use the pastebin. As it stands, your code may now have been permanently damaged/corrupted by the forum's parser.]

    http://wordpress.org/extend/plugins/contact-form-7/

  2. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 1 year ago #

    Because your theme's style.css applies 100% width to the fields.

    input[type="text"], input[type="password"], input[type="email"], input[type="url"], textarea
    {
       width: 100%;
       padding: 8px 0;
       color: #354046 !important;
       font-size: 13px;
       font-family: Verdana, Geneva, Arial, Helvetica, Sans-Serif;
       font-weight: normal;
       font-style: normal;
    }
  3. galtmilemediagroup
    Member
    Posted 1 year ago #

    I found the location of the style sheet here:
    /wp-content/plugins/contact-form-7/includes/css/style.css

    I did not find the code that you mentioned. should I just copy and paste your code and change the width to auto?

  4. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 1 year ago #

  5. bxdavi2
    Member
    Posted 1 year ago #

    How do I limit the text area to just 400 characters?

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic