How to use the Dynamic Form Module?

Webayt The Dynamic Form Module in the CMS allows you to create contact, quote, support, application, or custom information collection forms for your website. With this module, you can prepare form structures tailored to your needs, customize form fields, and track visitor responses through the administration panel.

Unlike the standard contact form, the Dynamic Form Module allows you to define form fields according to your needs. This allows you to create forms suitable for different purposes for each page or service.

What is the purpose of the Dynamic Form Module?

The Dynamic Form Module is used to create custom forms on your website. You can define the form's name, the text that will appear on the submit button, its order, the group it belongs to, and its activity status through the panel.

You can then create each field in this form individually to specify which information will be collected from the user.

For example, the Dynamic Form Module can be used to create forms such as these:

• Request for Quotation
• Support request form
• Application form
• Information request form
• Pre-registration form
• Service-specific contact form

How can I access the Dynamic Forms Module?

To access the Dynamic Form Module, you can follow this path in the administration panel:

 Modules → Dynamic Form Module

In this section, you can view existing forms, create new forms, edit form fields, or make changes to forms you have previously created.

Dynamic Forms List Screen

In the main list screen of the Dynamic Form Module, previously created forms are displayed in a table.

This table contains general information and action buttons for each form:

• Form Name: This is the name of the form that appears in the panel.
• Button Text: This is the text on the button that the visitor will see when submitting the form.
• Group: This is the group information to which the form belongs.
• Order: Determines the order in which the form is listed.
• Status: Indicates whether the form is open or closed.
• View Fields: Used to view and manage the fields of the form.
• Edit: Used to update the general information of the form.
• Delete: Used to remove the relevant form.

How to Create a New Dynamic Form?

To create a new form, go to the Insert Dynamic Form tab. On this screen, you define the general information for the form.

1. Open the Modules menu from the left-hand panel menu.
2. Enter the Dynamic Form Module field.
3. Click the Insert Dynamic Form tab.
4. Please fill in the fields for form name, button text, sequence, group selection, and form status.
5. Save the form by clicking the Add button.

Dynamic Form Insertion Fields

The following fields must be filled in on the Add Dynamic Form screen:

Form Name

The Form Name is only visible to panel users. Visitors will not see this name. Therefore, it is recommended to use a descriptive name so that the form can be easily identified on the panel.

Example form names:

 Help Center Support Form
Website Management Form
Request a Quote Form

Button Text

Button text is the text a visitor will see on a button when submitting a form.

Example button texts:

 Send
Get a Quote
Submit Support Request
Submit Application

Order

The order is used to determine the order in which forms are displayed. If multiple forms are to be used in the same field, the order values can affect the display order of the forms.

Group Selection

Group Selection determines under which group the form will be used. This field, especially when used for filtering in module management, ensures that the correct form is displayed in the correct group.

To display the dynamic form you created on the relevant page or homepage, the form must be added to the page via module management. For detailed steps on how to add modules to pages, you can review the " How to Add Modules to Pages?" guide.

Form Status

Form Status determines whether the form is active on the site or not.

• Open: The form is viewable and usable on the site.
• Closed: The form is inactive and not displayed on the site.

How to add fields after creating a form?

After creating a dynamic form, you need to define the fields that visitors will fill in. This can be done using the "View Fields" link in the form list.

1. Locate the relevant form in the Dynamic Forms list screen.
2. Click the "View Fields" button in the form row.
3. On the screen that opens, view the available fields for the form.
4. To add a new field, go to the Insert Dynamic Form Field tab.

Dynamic Form Fields List Screen

On the form fields screen, all fields for the relevant form are listed in a table. On this screen, you can see the label, field type, order, and mandatory status of each field.

The field list generally includes the following information:

• Label: This is the field name that the user will see on the form.
• Field Type: Indicates the type of field, such as short text, long text, or selection field.
• Order: This refers to the order in which the fields are displayed on the form.
• Requirement: Indicates whether filling in this field is mandatory.
• Edit: Used to update field information.
• Delete: Used to remove the relevant field.

How to Add a New Form Field?

The Insert Dynamic Form Field tab is used to add a new form field.

1. Go to the View Fields screen of the relevant form.
2. Click the Add Dynamic Form Field tab.
3. Fill in information such as field type, label, placeholder, width, sequence, and requirements.
4. Define data types or option fields if necessary.
5. Add the field to the form by clicking the Add button.

Dynamic Form Field Settings

When adding form fields, different settings can be configured for each field. These settings determine how and what information the user enters on the form.

Area Type

The Field Type determines the type of form field. The selected field type affects the format in which the user enters information.

Examples of usable field types:

• Short Text: Used for single-line information such as name, email, phone number, and a short title.
• Long Text: Used for longer texts such as messages, descriptions, or request details.
• Drop-down list: Allows the user to choose from a pre-defined selection of options.
• Single Selection: Allows the user to select only one option from a list of choices.
• Multiple Selection: Allows the user to select more than one option.

Data Type

Data type is used to specify the format of the information to be entered, especially in text-based fields.

Examples of data type options:

• Text: Used for general text entries.
• Number: Can be used for fields where only numerical values are required.
• Email: Used for fields to retrieve email addresses.
• Telephone: Used for fields where telephone numbers will be obtained.

For example, if you are creating an email field, you can select Short Text as the field type and Email as the data type.

Ticket

The label is the title of the field the visitor will see on the form. It is recommended that this field be written briefly, clearly, and explicitly tell the user what they need to enter.

Example tags:

 Name Surname
Email
Telephone
Request Title
Request Details

Placeholder

A placeholder is auxiliary text that appears within an input or textarea when the field is empty.

Example placeholder texts:

 Enter your first and last name.
Enter your email address.
Please write your request in detail.

Area Width

Field Width determines how wide the form field will be displayed on the page.

The available width options are as follows:

• Full: The field is displayed across the entire line width.
• Half: The area occupies half the space of the row.
• One-third: The area occupies one-third of the row's space.

For example, if the name, surname, and email fields are to be used side-by-side , half- width is preferable. However, for long text fields such as request details, full- width is generally more suitable.

Order

The order determines the order in which fields are displayed on the form. Fields with lower order numbers are displayed higher on the form.

Required Field

The Required Field determines whether the user is required to fill in that field.

• Open: This field is mandatory.
• Indoor: Space is optional.

To make forms more user-friendly, it is recommended to only require fields that are truly necessary.

Options

The options field is used in types of fields requiring selection, such as drop-down lists, single-selection, or multiple-selection.

The options to be shown to the user can be added individually using commas or by pressing the Enter key.

Example options:

 Web Design
SEO
Content Management
Technical Support

How to Edit or Delete Form Fields?

Each form field added can later be edited or deleted from the field list screen.

To update a field, you can click the Edit button in the relevant row. On this screen, you can update information such as field type, label, placeholder, data type, field width, order, and requirement status.

Unused or no longer needed areas can be removed using the Delete button. It is recommended to ensure the area will no longer be used before deleting.

Where are dynamic form messages displayed?

Responses sent via forms created using the Dynamic Form Module are displayed in the Messages → Dynamic Form Messages section of the admin panel.

In this section, you can review the form responses filled out by visitors. For instructions on viewing and managing dynamic form responses, please refer to the "How to View Dynamic Form Messages?" guide.

The Difference Between the Dynamic Form Module and the Communication Module

Webayt In a CMS, both the Contact Module and the Dynamic Form Module can be used to collect information from visitors. However, their purposes are different.

• Contact Module: Provides a standard contact form consisting of name, email, subject, and message fields.
• Dynamic Form Module: Allows you to create custom forms with fields that can be customized to your needs.

If a standard contact form is sufficient, the Contact Module can be used. If more specific fields, selections, or different form structures are needed , the Dynamic Form Module should be preferred.

What should be considered when creating dynamic forms?

When creating dynamic forms, it's important to prepare a simple and user-friendly structure that is appropriate for the form's purpose.

• Write the form name clearly in the panel so it's easily recognizable.
• Design the button text in a way that will guide the user.
• Avoid creating unnecessary numbers of fields in the form.
• Only make the truly necessary fields mandatory.
• Plan the page order based on user experience.
• Use clear and understandable options in the selection fields.
• Make sure the form status is open.

Summary

The Dynamic Form Module is a flexible module used to create custom forms in the Webayt CMS. After the general information of the form is created, the form fields are also defined, and the information to be collected from the user can be determined in detail. To display the created form on the relevant page, you can follow the module addition steps in the " How to Add Modules to Pages?" guide.

Responses to the created forms are displayed in the Messages → Dynamic Form Messages section of the administration panel. This allows for easy tracking of support requests, quotation requests, applications, or custom form submissions directly from the panel.