Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.

Okay
  Public Ticket #3671052
Form Formatting
Closed

Comments

  • Vinibailo started the conversation

    I need to achieve 2 things that I don't seem to find a way to do it.

    • I need the form on the homepage to have 2 text fields per line
    • I need the checkboxes to cover 100% of the width of the form
  •  7,120
    Oliver replied

    Hi, 

    I cannot load your page,  I get this: 

    7062462343.png

    Can you please provide this password AND some draft / screenshot of what do you have now and what do you need to achieve? Thanx

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  •   Vinibailo replied privately
  •  7,120
    Oliver replied

    Hi, 

    To achieve the desired layout, you can wrap the input fields in div elements with appropriate CSS classes for styling. This approach allows you to control the layout more precisely. Here’s how you can modify your form code to display "Name" and "Surname" in the first line, "E-mail" and "Zip Code" in the second line, and the checkboxes occupying 100% of the width of the form:

    <div style="display: flex; gap: 10px;">
        [text* first-name placeholder "First Name"]
        [text* last-name placeholder "Last Name"]
    </div>
    <div style="display: flex; gap: 10px; margin-top: 10px;">
        [email* email placeholder "Email"]
        [text* zip-code placeholder "Zip Code"]
    </div>
    <div style="margin-top: 20px; width: 100%;">
        <p style="font-size:32px; color:white; text-align:center;">Ways You Can Help</p>
        <br><br>
        [checkbox* checkbox-508 use_label_element "Collecting Signatures" "Making Phone Calls" "Displaying a Yard Sign"]
    </div>
    <div style="margin-top: 20px; text-align: center;">
        [submit "Sign Me Up!"]
    </div>

    I have inserted this code here: 

    https://flemm.noieragency.com/wp-admin/admin.php?page=wpcf7&post=855&active-tab=0

    Please check your homepage now.


    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver