How to Create Custom Login and Registration Forms in WordPress

The login page is the first thing users will see when they need to access your site, so it needs to be beautiful and user-friendly. A boring login page can give users a bad impression of your site! Customizing the login to match your brand will lead to a better experience for users.

In this post, we are going to look at how you can build custom login and registration pages using the UserPro plugin from CodeCanyon.

Advantages of Custom Login and Registration 

Enhanced User Experience

Customization enables enhanced functionality for your users. Users are likely to feel comfortable with a custom login page that fits the theme of your website as opposed to the default WordPress login page.

User Management

Customization allows you to manage every aspect of the newly created users. You can assign roles and approve or block users at will.

Branding

Branding is a critical aspect of any business. Your business should show its brand on every part of the website. Customizing the login and registration page allows your brand to stand out from the rest. Customization also creates a unique presence which users will likely remember.

Security

Customized login and registration allows you to add measures that get rid of spammers and hackers. 

Features of the UserPro Plugin

Social Login

The majority of people have accounts on at least one of the major social networks. Providing a social connect on your website provides an easy way to sign up since users only need to grant access to their profile information on one of those networks and never have to worry about coming up with or remembering a new password. Another advantage is spam reduction, since social networks require users to authenticate themselves in multiple ways.

With UserPro, you can allow social login via Facebook, LinkedIn, Instagram, Twitter, and Google.

Front-End Publishing and User-Generated Content

Front-end publishing offers a way for you to connect with your users, hence keeping your site more active.
If you wish to have users add, edit, or delete content, you can do so with UserPro.

Member Features

UserPro allows you to showcase beautiful member profiles and member features such as enhanced member directory, badges, and achievements. You can also search members within the searchable member list.

Multiple Registration Forms

Multiple registration forms allow you to create separate registration forms. For example, a job board might need such a feature for job seekers and employers.

Getting Started

Start by downloading the plugin from CodeCanyon. If you don’t have an account, head over to the signup page and create one. Once logged in, you can purchase the plugin from its product page.

You will then get a link to the files, or you can go to the downloads section of your account and download the zipped files.

Now log in to your WordPress account. Go to Plugins > Add New and upload the zip files. Then click Install Now and, after it finishes installing, click on Activate Now. You are now ready to start using the plugin.

Configuration

Once the plugin is installed, you can configure the following attributes on the settings page.

UserPro plugin configuration

Create a Registration Page

UserPro comes with default pages for registration, login, profile, member directory, etc. Choose which pages will be used from the General settings.

Choosing a registration page

Once you have chosen your pages, you can add or remove any fields according to your requirements. You can also change other attributes such as appearance, validation, and profile settings.

Membership Settings

Changing membership options

This option allows you to disable or enable registration to your website from the front-end.

Allowing anyone to register makes your website easily accessible and more user-friendly. It also allows admins to assign roles to users.

User Approval Settings

User approval settings

A majority of websites rely on more than one type of authentication for new users; this ensures that they weed out any malicious people from accessing sites. Having a user approval system:

  • allows you to deny or accept user registrations
  • authenticates new users by requiring them to activate emails
  • keeps away spammers

You can create user registration and login forms simply by dragging and dropping the fields to the provided sections, as shown below.

Createing custom user registration fields

Appearance and Look

UserPro allows you to add beautiful registration forms with just a click of a button. UserPro also gives you the flexibility of adding more fields if you wish to. You can thus get the right information for your business from the user.

It also provides you the ability to align the registration form with your brand by changing attributes such as font, size, skin, field layouts, and icons.

UserPro provides 19 fields for users, such as country, role, picture, gender, and website. You can also create a CAPTCHA-like security question that checks for real users and makes it harder for bots.

After a bit of customization, the registration page should now look like this:

A completed custom registration form

Registration Settings

Other registration settings include:

  • allowing or blocking certain email domains for registration
  • allowing certain roles during registration
  • setting status after registration
  • form validation and security

Create a Custom Login Page

UserPro provides a default login page with the required fields: username and password. Just like for the registration page, you can click on any field and change attributes such as the label placeholder and help text. You can also drag fields or sections to the page.

The steps for creating the login page are similar to the registration page:

  • Go to General and select the default login page provided.
  • Change its look and appearance to make it more user-friendly or fit your branding.
  • Change the login settings according to your requirements.
Editing the username field for a custom login page

The appearance and look settings applied to a field will be applied automatically to all other fields.

Social Integration

Navigate to Settings, where you will find a list of social networks you can integrate with. Choose the medium you want to make available to users and allow social connect. Each network will require slightly different information to enable social login. For example, Facebook requires a Facebook App ID, which you can obtain from the Facebook developer’s site.

Setting up social login with Facebook

The rest of the social networks require similar steps.

Custom WordPress Pages

WordPress provides two default login URLs: /wp-admin/ and wp-login.php, so anyone familiar with WordPress can find the login or registration URL. UserPro also allows you to create custom URL links for all user-related pages.

Navigate to the Setup Pages tab and update the permalinks as required.

Custom URLs for login and registration pages

Customize Email Notifications

Click the Email Notifications tab to view a list of all the possible email messages that can be customized.

Customize the email notification settings

This section allows you to customize email notifications. Just chose a type of message and you can customize the email that is sent for actions like:

  • new user registration
  • new user validation
  • welcome email
  • reset password
  • password change
  • account status change
  • and more

Conclusion

Customizing your login and registration pages is very simple and an essential investment that can lead to big rewards for your business. It will also enable you to obtain the necessary customer information needed to push your business to the next level.

Leave a comment

Your email address will not be published.