#1 Form Builder For WordPress : Ultimate Form Builder – Documentation
- 1. Unzip ultimate-form-builder.zip
- 2. Upload all the files to the /wp-content/plugins/ultimate-form-builder
- 3. Activate the plugin through the ‘Plugins’ menu in WordPress.
- 4. For customizing the plugin’s settings, click on Forms menu in WordPress of the left admin menu.
Plugin Main Settings
This is common main plugin settings where you can disable jQuery UI CSS, disable Font Awesome CSS if your theme has already included this files. Also you can enable advanced datepicker option from this settings as well if you want to replace UI default datepicker setup on frontend form.
Creating New Form
For creating a new form, you will simply need to click on the New Form submenu of the Forms menu or click on Add New Form Button on form lists page. On click the button, a popup form will appear. Then fill the name of the form and click on add new form, a new form will be created and you will be redirected to the form builder page where you can add various fields to build the form and configure other settings as well.
You can create either a single step form or multi-step form. The form builder section will differ for a single step and multi-step forms.
Once you create the form you automatically redirected to this section where you can add the available form fields in the form.
You can see all the available fields on the left side of this section as shown below in the screenshot. You can choose the different elements such as HTML elements, UI elements, Custom elements, Survey elements by switching the tab just above the form builder.
Currently, available fields are :
- Text Field
- Hidden Field
- Submit & Reset Button
- Datepicker Date Range
- Dropdown Date
- Dropdown Date Range
- File Uploader
- Custom Texts
- Agreement Block
- URL Field
- Star Ratings
- Like Dislike
- Choice Matrix
Note: Please use only one Captcha Field in the form.Using multiple Captcha may create conflict in the form and may not work properly.
Simply drag the left custom fields and drop it on right section in order to add fields for your form.
Add tooltip with small description on each elements near label on your frontend form.
In the display settings tab, you can configure all the necessary settings regarding the layout of the form. You can choose the form templates as per your requirement. There are 10+ pre-designed templates available along with a default template too.
Other Options available are –
1. Form Width: You can provide the width of the form either in pixel or %. But we recommend you to either leave blank or provide the width in % if you want your form to be mobile responsive. You can configure the Form Width in this section.Please provide the form width in % for the Mobile Device Compatibility.
2. Disable Plugin Styles: If you desire to custom design the form as per your site’s theme then you can disable all the plugin styles by simply checking “Disable Plugin Styles” checkbox in this section. But please note that if you select this option, form templates design won’t be applied in the form at all.
3. Hide Form on Successful Submission: If you desire to hide the form after successfully submission of the form then you can enable this option on backend display settings for specific form.
4. Form Submission Message and Error Message : In this option, you can provide the form validation error message and form success message of your own custom text. If you leave those fields blank then a default message of placeholder will be set on frontend display.
5. Hide Multi Steps Heading and Multi Steps Heading Tab Templates (New Update Feature) : This is new feature available on latest version 2.0 where you can hide multi step and choose any pre available template for multi step heading tab section. There are altogether 18 pre available templates.
6. Enable Scroll To Top On Click Next Button (New Update Feature): In this option is only used in Multi step form so will be only displayed while your form is created for multi step configuration. Enabling this options will help you to set the Next button on click event to scroll to top position of your form. Also you can set custom scroll to top speed in ms.
In this section, you can find unlimited customization options for form templates such as form title font color, text alignment, form padding, background color, form title font size, label and sub label font color/size, upload button background color, font color, rating hover color, tooltip icon font color, submit button background color, font color, font hover color as well as for reset/next/back button customization options are also available. You can even change font color of success and error message from this section.
In this section, you can configure all the email regarding settings such as email receiver email address, from the name, from email and email subject. You can also add multiple email receiver address. You can also configure From Email, From Name, Email Subject & Message Format.
You can also configure email auto respond in this section through which you can configure the auto response email to any of the email field available in the form.
In this section, you can manage all the conditional logic related to this form. Currently, there are three types of conditional logic available for the form.
- Display Logic – will be useful to show or hide any elements as per the value of another element
- Email Logic – will be useful if you want to email specific users as per the value of any specific form element
- Redirect Logic – will be useful if you want to redirect the users to some specific page as per the value of any specific element after the successful form submission.
As soon as users submit an entry through a form build from our plugin kept in the frontend, it will get stored in your site’s database and all the entries are listed in the form entries. You can filter the form entries form wise and also export to CSV. Please note that to use CSV export you will need to filter the form entries first.
Form Export/ Import
You can export and import the forms from this section. Please note that you can export the form entries from form entries section.
Here you can export plugin’s form file in json.
Form Import Settings Page: Here you can import country, city and states fields as well as import our plugin’s form file.
Once you create a form, you will find a shortcode at the top of the form builder page as well as in the form listing page which you can paste to any post or page content editor and the form will show up in the same section of the content where you have kept the shortcode.
More WordPress Resources
Themes Compatible with the Plugin :
Ultimate Form Builder works best with every WordPress theme. It’s even more remarkable when used with popular themes like VMagazine and AccessPress Parallax.
AND IF THIS PLUGIN HAS IMPRESSED YOU, THEN YOU WOULD ENJOY OUR OTHER PROJECTS TOO. DO CHECK THESE OUT :
WPAll Club – A complete WordPress resources club. WordPress tutorials, blogs, curated free and premium themes and plugins, WordPress deals, offers, hosting info and more.
Premium WordPress Themes – 6 premium WordPress themes well suited for all sort of websites. Professional, well coded and highly configurable themes for you.
Premium WordPress Plugins – 45+ premium WordPress plugins of many different types. High user ratings, great quality and best sellers in CodeCanyon marketplace.
AccessPress Themes – AccessPress Themes has 50+ beautiful and elegant, fully responsive, multipurpose themes to meet your need for free and commercial basis.
8Degree Themes – 8Degree Themes offers 15+ free WordPress themes and 16+ premium WordPress themes carefully crafted with creativity.