New to the community? Start here

[Forminator Pro] Forminator Name field

How do I change the layout of the name field so that first name & second name appear on the same line?

I cant find a way to do this using the forminator setup

Can anybody help me

Thanks

John

Thu, 13 Jun 2019 8:24:22
More Forminator Pro discussions
Forminator Pro
  • Nebu John
    • FLS

    Hi webhunter,

    I hope you’re well today and thank you for reaching out to us!

    By default, new fields will occupy one row in Forminator. To organize your fields into columns, simply drag and drop a field into the same row as another field. You can add up to four fields to a single row.

    I appreciate if you could read this handy URL to get the most out of Forminator plugin. :slight_smile:

    Feel free to get back to us if you have any doubts or need any help further.

    Kind Regards,

    Nebu John

  • webhunter
    • Site Builder, Child of Zeus

    Hi Nebu,

    The problem I have is specifically with the name field in forminator |Pro.

    If you set this to request multiple fields (ie first name, last name etc) then each of the fields occupies a separate line and there is no option to drag and drop these onto the same line. Is there a way to do this, or do I need to create 2 separate name field one for first name and the other for second name? Although doing makes the option of creating a multiple field based entry redundant.

    Is there any way to use the name field in multiple field entry mode and specify that the fields appear on the same line?

    Hope this makes sense?

    Kind regards

    John

  • Nebu John
    • FLS

    Hi webhunter,

    Apologies for not reading your issue correctly. I am afraid you will have to create two separate name field one for the first name and the other for the second name as an easy method.

    Apparently, you can use the below-given CSS code to make your first name and last name field in a single line.

    @media all and (min-width: 780px) {
    
#name-1 > .forminator-row {
    
width: 49%;
    
float: left;
    
margin-right: 2%;
    
}
    
}

    To add this CSS into your form, you will need to Enable Custom CSS in your form. You can find this by navigating: Edit Form >> Appearance >> Custom CSS

    Hope this helps you.

    Kind Regards,

    Nebu John