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 thus needs to beautiful and user-friendly. A boring login page can make users have a bad impression of your site! Customization of 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
Enhance User Experience
Customization allows for enhanced functionality to 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 in 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 in 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 Registrations 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 installed, you can configure the following attributes in the settings page
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.
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
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
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.
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:
Registration Settings
Other registration settings include:
- allowing or block 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. Follow the following steps
- 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
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 which 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 Facebook App ID which you can obtain from the Facebook developer’s site.
The rest of the social networks require similar steps.
Custom WordPress Pages
WordPress provides two default login URL’s: /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.
Customize Email Notifications
Click the Email Notifications tab to view a list of all the possible email messages that can be customized.
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.