User Registration – Advanced Fields

Installation #

  1. First, purchase the User Registration – Advanced Fields add-on.
  2. After the process succeeds, you will get the add-on zip file under your WPEverest account page.
  3. Now, you can download the add-on zip file from there.
  4. After you log into your WordPress Dashboard, go to Plugins > Add New and click Upload Plugin button available there and choose the file you’ve downloaded and click Install Now button. Make sure to install the user-registration and WooCommerce plugins too.
  5. This will install the add-on. Now, you’ve to activate the addon from the Install plugin list.
  6. Now you are ready to use this add-on for your site.

Now you will be able to add extra fields in your form.

Advanced Fields #

With the activation of User Registration Advanced Fields add-on, you’ll be able to access the advanced fields in the drag-and-drop form builder.  There are Eight Advanced Form Fields provided by the plugin. These fields will bring the best out of your registration forms. Therefore, you can create professional and advanced registration forms now. We have explained the use and implementation of these fields below:

Section Title:  #

This field allows you to add a heading or divide certain fields. On the Fields Options, you can easily change the Label to add the section title on your form.

User Registration advanced fields

Time Picker:  #

With this field, you can add time to the registration field, so that users could be able to enter time during registration. In the Field Options, you will find the settings for label, description, advanced settings and more.

  • Default to current date: Check this option to set the current date as default.
  • Enable Min Max date: Check this option set the Minimum and Maximum Date.

HTML: #

 HTML field allows you to enter the HTML and code contents to display in the frontend. In the Field Options, you can change the Field Label to your liking and add the HTML code of your desire.

Phone:  #

This field allows users to enter phone numbers specifically. On the Field Options, there are the settings for Label, Description, Field Name, Required and Hide Label. Also, the main settings for the Phone field are the Select Format setting. There are two choices for the Format: Default and Smart.

When you select the Format as Default, you can see the Input Mask option too where you can enter a custom input mask.

User Registration phone default

When you select the Format as Smart, it displays the country flag with validation and you don’t need to enter an Input Mask.

User Registration phone smart

WYSIWYG:  #

This field allow users to enter the formatted text and contents wherever necessary. It allows users to submit content without having to use custom code or the use of HTML.

User Registration wysiwyg

Select2: #

The Advanced Fields add-on allows you to insert the Select2 field to your registration forms. Select2 is a jQuery based replacement for select boxes. It supports searching infinite scrolling of results. In the Field Options, you can change the Field Label, Description, and add the Multiple choice options.

Multi Select2: #

The Multi Select2 form field allows users to select multiple options and all of these choices will be displayed in the form field in the frontend. Just like Select2 field, it supports searching infinite scrolling of results. In the Field Options, you can change the Field Label, Description, and add the Multiple choice options.
From version 1.9.4 We have come up with the “Choice limit” feature where you can enter the minimum number of choices that can be selected.



And now, you can add a choice to select all the option from the advance settings of the MultiSelect2 which will help users to select all the options if necessary.

Profile Picture: #

Finally the last and the newest addition to the Advanced Field add-on, the Profile Picture field is a highly intuitive field that allows users to upload or take a profile picture from their computer. 

Frontend View

The user can easily Take a picture from their webcam or Upload File from their computer.

When the Upload File option is selected, the user will select an image file and then they can crop their image to fit size.

When the user selects the Take Picture option, the site will request to allow the webcam of the user to take the picture. Then, the user can capture the picture and crop to fit the size.

Note: #

For the Profile Picture field to work on the frontend, you must make sure that your site is secure with SSL and HTTPS. Or else, it will show an error like this.

Range(Slider) #

The range is a field that is available now in the “Advanced Fields” add-on, where you can add a field called Range, to display a beautiful user-friendly bar slider in the front-end of the form, where users can select a value from the provided data by dragging the Handle.

You can find this field in the Advanced Fields section once you have activated the add-on.

On clicking on this field, you will see field options where you can set the different settings under the General Settings and Advanced Settings. The field options that can be set in the Advanced Settings are as below:

  • Minimum Value: To provide the Minimum allowed number.
  • Maximum Value: To provide the Maximum allowed number.
  • Steps: To provide legal number intervals when the slider is moved once.
  • Display Slider Prefix/Postfix: Enable this to use Prefix/Postfix for Range Slider.
  • Use Text Prefix/Postfix: Enable this to use Prefix/Postfix texts in the Range Slider.

As a result the range slider will look like this in the frontend.

Payment Slider #

Along with the range slider, now you can use the payment slider in your from too. To activate the payment slider on your form, you have to install the payment add-on on your site. After the activation of the payment add-on now, on the field option setting, you will find an option to enable the payment slider.

After enabling the payment slider on the setting, Now you are ready to use the payment slider on your form and you can choose any amount with the help of the slider.

Powered by BetterDocs