The Forms feature on WebSell empowers users with comprehensive control over their form creation process. To begin configuring your form, follow these steps:
Accessing form settings
Start by logging into your WebStore Manager and navigating to the 'Design & Content' section, specifically the 'Form Builder' option. Here, you can either create a new form or edit an existing one. Once in the form editing interface, click on 'Form Settings' to access the basic settings for your form.
In the 'Form Settings' tab, you can customize the essential parameters of your form. Typically, the default settings suffice for most users. The form's name cannot be removed; if you require a new name, you'll need to create a new form. The description serves as a reference for you but remains invisible to your shoppers. You can also decide what action the form should take upon submission, including the option to validate the form server-side to catch and highlight any errors.
Advanced settings
Be cautious when delving into advanced settings, as they may require technical knowledge. The 'Form ID' adds an id attribute to the form tag for CSS targeting, while the 'Form Class' does the same for the class attribute. 'Form Action' and 'Form Method' are primarily for development purposes, with the latter being crucial if you intend to receive form submissions via email.
Form layout
Determine how your form's fields should be arranged. You have two fundamental layout options: placing field labels either above or to the left of the fields and selecting how the fields are wrapped. In most cases, the default layout works well without the need for CSS adjustments.
Within this feature, you can also incorporate various types of fields into your form:
- Text Field: Basic text input.
- Submit Field: Sends information to the form handler.
- Select Field: Creates a drop-down menu, useful for restricting user choices.
- Checkbox Field: Allows shoppers to select checkboxes.
- Textarea: Enables the input of a block of text.
- Radio Field: Adds radio buttons for selections.
- Number Field: Includes numeric input with customizable limitations.
- Email Field: Validates email addresses.
- Hidden Field: Conceals data from users but sends it to the form handler.
- File Field: Permits file uploads.
- Paragraph Field: Embeds explanatory text within the form.
- Recaptcha Field: Distinguishes shoppers from automated bots.
To streamline the form-building process, basic and advanced field controls are available. Basic controls are essential attributes for field editing, while advanced controls group less commonly used attributes, including data attributes, classes, validation patterns, read-only status, and more.