How to Create a Custom User Registration Form in WordPress
November 5th, 2018 in Wordpress |

Do you want to create a custom front-end user registration form in WordPress? The default WordPress user registration form shows WordPress branding and does not match your site’s theme. In this article, we will show you how to create a custom user registration form in WordPress.

Why Add a Custom User Registration Form in WordPress

The default WordPress user registration page shows WordPress branding and logo. It does not match the rest of your WordPress site.

Creating a custom user registration form allows you to add the registration form on any page of your WordPress site. It helps you deliver a more consistent user experience during the registration process.

A custom user registration form also allows you to redirect users upon registration. You can also display additional user profile fields, combine it with the custom front-end login form, and connect it with your email marketing service.

Creating a Custom User Registration Form in WordPress

The first thing you need to do is install and activate the WPForms – WordPress forms plugin.

WPForms is the best WordPress contact form plugin that allows you to create all type of forms in WordPress.

You will need at least the Pro plan to get access to their user registration add-on.

Upon activation, you need to visit WPForms » Settings page to enter your WPForms license key. You can get this key from your account on WPForms website.

wpforms-license

Next, you need to visit WPForms » Addons page. Click on the ‘Install Addon’ button next to ‘User Registration Addon’.

installaddon

WPForms will now download and install the User Registration Addon. You will need to click on the ‘Activate’ button to start using the addon.

activateaddon

You are now ready to create your custom user registration form.

You need to visit WPForms » Add New to launch the WPForms Builder.

First, you need to enter a name for your form and then select ‘User Registration Form’ as the template.

formbuilder

WPForms will now create a simple registration form for you. This sample form will have following WordPress user registration fields added by default.

  • Name – First and last name
  • Username
  • Email
  • Password
  • Short bio

You can add more fields to the left panel. You can also drag fields to rearrange their order.

Adding Custom Fields in Your Custom User Registration Form

WPForms also allows you to connect custom user profile fields to your user registration form.

To do this, you will need to add additional user profile fields to your WordPress site. The easiest way to do this is by using a plugin.

In this example, we are using the User Meta Manager plugin. However, the field mapping feature of WPForms works with any plugin that uses standard WordPress custom fields to add and store user metadata.

The first thing you need to do is install and activate the User Meta Manager plugin.

Upon activation, you need to visit Users » User Meta Manager page and click on Add Custom Meta button to continue.

customusermeta

First, you need to enter a key. This key is how the custom user profile field will be recognized internally.

Next, you need to choose a field type. In this example, we are using a URL field to add Facebook profile URL. Under ‘Label’, you need to enter the label that will be visible to users when filling this field.

Click on the Submit button to add the custom meta field. You can now visit Users » Your Profile page to see the field in action.

fbfield

Now that we have created a custom user profile field, let’s add it to the custom user registration form in WPForms and then map it.

You will need to visit WPForms » All Forms page to edit your custom user registration form or create a new one.

After that click on a field from the left panel to add it to your form. In this example, we are adding a website/URL field to our form.

addfields

The website / URL field will now appear in your form preview. You need to click on the field and WPForms will show its properties in the left panel.

We need to change the label from Website/URL to Facebook Profile URL. You can also add a description for the field.

editfield

Don’t forget to click on the Save button at the top right corner of the screen to save your form.

Next, you need to click on the Settings button for advanced form settings and field mapping. On the Settings page, click on the User Registration tab.

WPForms will now show your form fields and a drop-down menu below them to select the WordPress registration field to map it with.

You will notice that WPForms will automatically map your default fields like Name, Email, Password, etc. You can also select a page where you want users to be redirected to once they submit the form.

You will need to scroll down to the ‘Custom User Meta’ section. Here you can enter the custom meta key you created earlier and then select the form field you want to map it with.

mappingcustomfields

Don’t forget to click on the Save button on the top right corner of the screen to save your settings.

Adding Your Custom User Registration form in WordPress

WPForms makes it super simple to add forms into your WordPress posts, pages, and sidebar widgets.

You need to create a new post/page or edit an existing one. On the post edit screen, you will notice the new WPForms button.

addform

Clicking on it will bring up a popup. You need to select your form from the drop-down menu and then click on the Add Form button.

You will notice the WPForms shortcode will appear in your post’s content editor. You can now publish or save your post/page and then preview your form.

customregistrationform

WPForms also allows you to add your custom user registration form in your sidebar. Visit Appearance » Widgets page and add the WPForm widget to a sidebar.

addformsidebar

You need to select the form you want to show from the drop-down menu in the widget settings. Don’t forget to click on the save button to store your widget settings.

That’s all, you can now visit your website to see your custom user registration form in action.

sidebarregistrationform

We hope this article helped you learn how to easily add a custom user registration form in WordPress.