[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

  • Nebu John
    • Staff

    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
    • Flash Drive

    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
    • Staff

    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

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.