Soffront Web Forms help you to build customized online forms and publish them on your website.
This article will show you how to build and use Web Forms.
Please follow the below steps to access and create Web Forms:
Go to Marketing > Lead Capture and click on Web Forms.
1. Click on the 
button to open the Create New Web Form page as shown below.
Create a Web Form Page
2. Table: By default, the Accounts table is selected.
3. Name: By default, the name is Opt-in-Form, but you can change it to a friendly name to identify the form.
4. Group: Select the group you want to associate this web form with. You can choose multiple groups. Leads created through this web form will be added to the selected groups. Select a group from the dropdown.
5. Or Click on Add a new group option to add a new group to the list. Then click on Save
6. Return Url: Type in an Url where the form will redirect the Submitter after Successfully posting the Web Form.
7. Auto Response: Select an Email template from the drop-down list or create a new template this will be used to send an email to the end user who submits their information through this form.
8. Assign to: From the drop-down, you can choose a Sales Representative. This will assign all the leads coming in from this form to the selected Sales Representative.
9. Source: Choose the source from the drop-down list.
10. On the Web Form Designer page on the left-hand panel, you will find Color and Fonts.
Using Color and Font you can design the following:
- Outer Section
- Form section
- Header
- Normal Fields
- Required Fields
11. On the web form, the designer page fields for your web form. You will find First name, Email, Comments and Subscribe to our newsletter fields are added by default.
12. Insert Field
a. To add field click on an existing field and then click on Insert Field.
b. Insert Field dialog box opens.
- Name: Select a Field from the drop-down list you want to add. There are 16 defined fields and 8 undefined fields.
- Label: The label is populated by default and is the same as the name. You can type in a different label if you want to change it.
- Size: Select a size for the field according to the Name of the field you have chosen.
- Required: Check Required if you want to make it a required field.
- Click on OK to add the field.
13. Insert Header
- To add header click on an existing field and then click on Insert Field.
- Insert header dialog box opens
- Type in a Label name then click on OK.
14. You can edit the Header/Label click on the field you want to edit and then click on Edit.
15. You can delete all fields except Subscribe to our newsletters by clicking on an existing field and then clicking on Delete.
16. You can rearrange your field by clicking on the left of the field name. This will allow you to drag and drop to wherever you want to move that field.
17. Click on Save to save all changes. The Alert dialog box opens as shown. Click on Ok.
18. After saving the Web Form you will find 2 new buttons have been added to the page: Generate and Preview.
Create a Web Form Page
19. You can Preview your Web form by clicking the Preview button.
20. Click on Generate to generate HTML code that can be used in your web page. You will get the below screen.
Note
-
- Without Styles: This format doesn’t have the Subscribe to our newsletters checkbox: Email Status will be Opted In by default
- With Styles: For with Style web form where Subscribe to our newsletters Check box is available:
a. If the recipient checks the Check Box: Email Status will be Opted In
b. If the recipient does not check the Check Box: Email Status will be Unknown
21. This will generate the HTML code you need to use on your webpage.
Generate Form dialog box
22. Click on Copy to my clipboard to copy the HTML code to your webpage.
23. Then paste it into your webpage. The Web Form will be added to your page.
24. Click on Close to go back to Web Forms list view page.
25. Then click on Refresh to see the recently added Web Form.
26. You can Publish Or Unpublished a Web Form by checking the box of the Web Form you want to be Publish Or Unpublished and clicking the More icon on the top left of the Actions shortcut menu.
27. You can Delete a Web form by clicking on the Delete option from the list.