How to create a elementor user registration form?

Time needed: 5 minutes

Do you want to create a custom user registration form with the elementor form and want to add additional user information? For this we can use Elementor Pro’s form widget for creating the user registration form with the basic form fields. Let’s begin and follow the below steps.

1. Create a new page for user registration (Optional).

   If you want a separate sign-up form page. Then, you need to create a page in WordPress that you would like to use as signup/registration form and edit it with elementor editor.
   
   1. Create a new page in WordPress From the WordPress dashboard, click Pages > Add New
   2. Name your page.
   3. Click the Publish button (Visibility options may be set if page is to remain private).
   4. Click Edit with Elementor to enter the Elementor editor.
   
   

2. Create a elementor registration form as you want.

   Drag and Drop the form widget in page where you want to show registration form. Then change the Form Name as you can see in the below image.
   
   

3. Add custom registration form fields in the elementor form widget.

   After change the form name, you need to add registration required fields and additional fields (if any). Find below the registration required fields and optional fields. Which we are using in this tutorial.
   
   The required fields is Username, Email Id, Password, First Name, Last Name. And for the demonstration we are going to add two additional optional fields with the name – Phone and Bio.
   
   

4. Add functional code and save the registration fields value in the user profile.

   Here is the code preview, you can copy it from the GitHub link. And paste this code in a file as signup.php and put this in the /wp-content/plugins/elementor-sign-up/ folder.
   
   
   
   Note: And, If you have added more custom form fields, you can repeat the update_user_meta line and replace the label name in your plugin file with your form label.
   

5. Activate custom elementor signup form plugin.

   After all of that you need to activate this plugin from the plugin dashboard.