How to Display Fields in a Single Column on Mobile – WPForms

Certainly! If you want to convert a multi-column form layout to a single column when viewed on mobile, follow these steps using WPForms:

1. Creating a Multi-Column Form Layout:
   • Start by creating a form with multiple columns. For example, let’s create a two-column layout using the CSS class wpforms-one-half.
   • The first field in each row should also use the wpforms-first class to indicate that it starts a new row.
2. Displaying Fields in a Single Column on Mobile:
   • In the form builder, click on a field to display the Field Options.
   • Under the Advanced section, add the wpforms-mobile-full class to the CSS Classes field.
   • Repeat this for other fields in the form.
   • Don’t forget to click the Save button to keep the changes.

Now, when mobile visitors access your form, the multi-column layout will be shown as a single column. Your forms will look professional and user-friendly on smaller screens! 📱