The Ultimate Guide To Create Custom Login Page In WordPress | 2018

The Ultimate Guide To Create Custom Login Page In WordPress | 2018

As we have been listening for a long time “The first impression is the last impression”. The best quote that is applied here very well. Like that, creating custom login page in WordPress is a good way to make the best first impression. Along with this, a login page makes your branding strong. By adding it, you can add more fields and get more information from the users.

However, a custom login page permits users to log in your site from a custom page instead of the default WordPress login page. And also, to create it is not a daunting task.

By default, WordPress has a generic login page. It does not provide any built-in option to add your own logo. But, there are some external methods which allow you to easily create custom login page in WordPress.
Hence, keep reading the guide. Here we will explain to you when, why and how we can create custom login page in WordPress.

When and Why You Need a Custom Login Page

If you are running a membership site and you do not use WordPress membership plugins, then your users will register and login to your site by using default WordPress login page.

However, this can work for small websites. But, if you are running a business site or an online community, then you may show your own brand rather than WordPress.

There is one way to do this, you can add own logo and white label WordPress admin dashboard. If you want the users do not access the admin area at the time of login then you have to add a custom login page.

Also, it works like any other page of the WordPress website. It uses the colors and style of WordPress theme and your users don’t even see the admin area of your website.

Now we will show you how to create custom login page in WordPress. Let’s have a look:

Methods to create custom login page in WordPress

There are some various ways to build custom login page in WordPress. Let’s see:

Method 1: Manually create WordPress custom login page

For this, you need to tweak a few of your theme’s source file. It’s not a difficult task. Here we will show you an example by using the Twenty Fifteen theme.

The very first, create a copy of the page.php file and the content-page.php file. Thereafter, rename both new copies to page-login.php and content-page.php respectively.

Now you have to open a page-login.php and change only a single line of code shown below:

From this:

“get_template_part( ‘content’, ‘page’ );”

To this:

get_template_part( ‘content’, ‘login’ );

Here, edit the content-login.php and add only one lline of code right below <?php the_content(); ?>. See below code.

<?php the_content(); ?>
<?php wp_login_form( array(‘redirect’ => home_url()) ); ?>
<?php wp_link_pages( array( …

Note: Here, at this stage, if you want to perform many other customizations (like adjusting the design/layout, removing the sidebar), you can do, but these all are optional. However, by changing only these two lines of code will do a great job if you are going for an additional approach with your new WordPress login page.

Now create a new page in the wp-admin and call it “login”. Keep in mind that the “login” also should be in the permalink.

Create Custom Login Page In WordPress

By doing so, WordPress uses automatically your page-login.php template file. Remember that your new page should look like this:

new login page

Now, to set redirections to ultimately eliminate the default WordPress login page. Do so by placing these lines at the end of your function.php file:

code image

That’s All! Now you have successfully created your new one WordPress login page. The best thing is that you can edit it via WordPress’ default page editor.

Method 2: creating custom login page with Theme My Login

To create it with Theme My login follow the given below steps:

  • The very first, you have to install and activate the Theme My Login plugin.
  • After activation, the plugin will enable custom login page which matches your WordPress theme. After this, You can go to the login page and see the custom login page.

tml-login

  • This plugin is also used to create custom registration and profile pages, custom emails and setting up custom redirects.
  • For enable these feature you will have to click on the TML menu in the admin bar to the configure plugin settings.

Custom Login Page For WordPress

  • Also, check the box that is next to the module, that you want to enable. Enabling all modules will also enable the module’s setting tab.
  • For example, if you enable custom email module then it will add an email tab under the TML menu.

tml-email

  • Although, this plugin has also a custom login widget. To do this, go to the Appearance > Widgets page and add theme my login widget to a sidebar.

tml-widget

Method 3: Creating a Custom Login Page using WPForms

It is a beginner friendly Contact form plugin for WordPress. However, the premium version of WPForms permits you to create custom WordPress login and registration forms. It is used to create a custom login page however it is also used to create custom user registration page with anti-spam features.

Here we have some steps to create it using WPForms:

  • First, you have to install and activate the WPForms plugin.
  • After activation, you need to enter your license key. For this go to the WPForms > settings page. Also, you can receive this key from your WPForms site’s account.

wpforms-license

  • After verification, you have to go to the WPForms > Add-ons page.
  • Now go to the ‘User Registration Addon’ and click on the Install Addon button.

userregistrationaddon

  • Thus, WPForms will bring and install the addon. Click on the activate button for using this. After activation, you are ready to create a custom login page.
  • For this go to the WPForms > Add New page and enter the form name and select ‘User Login Form’ template.

newloginform

  • Also, it will launch WPForms’ form builder. You will see the login fields preloaded in the form. To edit it, click on a field.

loginformedit

  • Now, click on the setting tab and then select confirmation. This is where the field you define what to do on successful login.

 

  • You can show a page or a message to the users or you can redirect them to any URL. Click on the save button to save your form setting. And if you want to exit from form builder then click on the close button.
  • Now you are ready to add this custom login form to a page on your WordPress website.
  • Create a new page or edit a page that you want to use as a custom login page. Click on the add form button which is above the post editor.

addform-1

  • This will show you a popup where you have to choose the custom login form which you created and click on the add form button.
  • However, the form shortcode will see in the post editor. Now you can save your page or publish it or you can continue editing the post.
    Now, you can go to your website to see the custom login page.

loginpagepreview

  • Also, you can add your login form as a widget to the sidebar of your website. To do this go to the Appearance > Widget page and add WPForms to a sidebar.
  • Choose your custom login form in the widget settings and click on the save button to save your changes.

customloginwidget

Method 4: Creating custom login page with Custom Login Page Customizer

This method works differently from others because this one modifying the default one instead of completely creating a new page.

To do this, you have to install and activate the Custom Login Page Customizer plugin. Thereafter, visit Appearance>>Login Customer. Now you can launch the customizer panel.

Custom Login Page Customizer

This plugin offers a lot of options which are quite nice and allow you to adjust things such as:

  • You can set a background for the form itself.
  • Set the background for the complete login page.
  • Instead of default WordPress logo, it set your own logo to appear.
  • Install a security add-on to get an extra captcha field in the form.
  • Adjust every little detail and form styling such as: font, sizes, colors, fields, etc.

Some others WordPress custom login page plugins

  1.  LoginPress
  2. Custom Login
  3. Custom Login Page Templates
  4. Admin Custom Login
  5. Custom Admin Login Page WPZest

That’s All!

Now let’s get information on how to fix WordPress login issues & errors:

Common WordPress Login issues

“Being stuck frustrates a lot”. Once in a while, we all stuck in login issues. And we get out of it very soon. Only if, we are aware of the reason and the way to get out of such issues. What if, you are stuck in WordPress login issues?

The login issues are common but the reasons for this is always in suspense. After facing such issues, we collected certain cause and created a combined list of all common WordPress login issues and How to get rid of it?

See the list of the most common WordPress login issue which user face frequently-

  • Domain
  • Theme Issues
  • Lost Password
  • Plugin Interference
  • Browser Cache files
  • Corrupted Login Files

Now start explaining each issue one by one:

1. Domain

When you log in to your WordPress admin panel you may not observe the domain or URL you are accessed the admin page. To login admin page the URL used is usually like this www.domainname.com/wp-admin/. Instead of this use www.domainname.com/wp-login.php. Both URLs are same and you can easily login to your site.

2. Theme Issues

You must wonder how a theme can cause and WordPress login problem. But it happens! especially when the theme holds a custom login page. It results when you install a problematic theme or the updated WordPress core is incompatible with the theme.

To investigate whether the theme is creating an issue or not rename the active theme directory file. After this WordPress will refuse to identify the file and you might be able to log in.

To reach the active theme directory file you need to access the wp-content/themes folder via using FTP client. Once you reach the file change its name. Then the WordPress is unable to recognize the file and deactivate the theme.

Now, try to log in and check whether the WordPress login error is solved or not. If you successfully login the WordPress admin panel then it confirms that the theme is creating the problem and you have to move to your default theme.

3. Lost Password

Little childish but its true too! We usually forget our password or get confused with other passwords. If the same happens with you need to reset your password.

As a result, there are literally quite a few completely different potential solutions that you just could have to be compelled to run through.

The very first and simple way to reset the password is to click on ‘Forget Password’ and enter your e-mail ID. A link will be sent on your email to reset the password. Due to some reason, the method is not helpful then go for another trick.

If you own a Linux server then you must have access to phpMyAdmin. Meanwhile, before you start, create a backup of your site. And then follow the Step

  • Access phpMyAdmin, Search for your database and find out wp_users table.
  • Here, you get the list of users, search your username in the user_login column. Click on ‘Edit’ located next to that row.
  • Now, open user_pass field and type a new password into the Value field.

WordPress login issue

  • Down in menu select MD5. On completing the process click on ‘Go’.

After this, you are able to login in WordPress admin panel with the new password.

4. Plugin Interference

Sometimes the plugin shows resistance and blocks the login. To ensure that the plugin is causing the error you need to deactivate it. this can be done by temporarily renaming the plugin folder.

As the WordPress login is stuck use FTP client. Search the wp-content/plugin folder and rename it. After this WordPress is not able to recognize the folder and deactivate all the plugin.

Once the plugin is deactivated try to log in. if now you are able to login in admin panel then the error is definitely in a plugin.

Moreover, after finding that the plugin is causing the issue you need to troubleshoot to find out Which plugin is causing the issue. to discover which plugin is causing the issue.

5. Browser Cache files

Cache files are the files stick in browser’s data. This files stores user’s interaction with a particular website. While you are accessing your WordPress admin the browser loads the last interaction of your site. That’s why you are not able to successfully login the WordPress.

The simple way to remove this error is clear your browser’s cache file and reload the page. Try to log in now if still not happen move on to next reason.

6. Corrupted Login Files

Here we talk about the wp-login files. This file contains the location and order of all the login page hooks.

However, If the WordPress login files, vanished, corrupted and misplaced then you will not be able to access your WordPress admin panel again.

To resolve the error you need to replace the old file with a new one. Before you proceed, as suggested previously backup your WordPress before deleting any file.  Follow the steps given below-

  • Using FTP client locate your wp-login.php file in the root directory and delete it.
  • Now, install the latest version of WordPress
  • Copy the wp-login.php file from a new version of WordPress.
  • Paste this file in place of your deleted file.

Next, Open the new login file and explore for “redefining user_login.” Search the below-written code and replace it.

$user_login = $user_data[“user_login”];// Replace it with this line

$user_login = $user_data->user_login;

Once it’s done! you are able to log in the admin page. But still not done then go for another way. The same process you can do from WordPress Cpanel.

Furthermore, as we all know that “Security is the first priority”. That’s why let’s discuss how we can keep secure our WordPress login page.

Some important tips to secure the WordPress login page

There are some tips which will help you to secure your WordPress login page:

1. Change Username

The default username in WordPress is “Admin”. if they can guess your password, you’ve actually given them an invitation to enter. So for this change your username to something unique that might not be guessed.

You can change the username by following these simple steps,

  • Firstly Login to WordPress using your current Admin user account.
  • Next, Add a new user by clicking on Users > Add New.
  • Select “Administrator” as the role for this new user. Go for a unique username as this newly added user will convert into the new admin user.
  • Log out of the old “Admin” user account. Log in repeatedly using the new unique username you just created.
  • Lastly, delete the original “Admin” user. You’ll need to reassign all your old posts from the old “Admin” user to the new user.

2. Strong Password

Strengthen your password so bots can’t assume it. Days, pet’s name, favorite celebrity can all be guessed instantly. Brute force attacks are just rapid and repeated attempts at guessing the password by error. And they can succeed if the password is weak. So the strong passwords are necessary for WordPress Security.

For strong passwords use a combination of numbers and letters, it can be the uppercase and lowercase letter. You can also take the help of a Password Generator. Just Check if your password is strong at How Secure Is My Password. And change the password on a daily basis for securing your login page.

3. Hide the login page and Wp-Admin page

A hacker wants to find your login page if he or she aims to brute force the login page to obtain access. You can prevent this by utilizing what some call security through obscurity. Your website would be the equal of a bank without a door or any other public entry point.

Many WordPress websites have the login access point at yourwebsite.com/login.php. Try writing webhostingsecretrevealed.net/login.php into your browser’s address bar and it will not work because it doesn’t exist. The login access for WHSR is situated on a different URL. Also, you can change the access point on your website to anything else.

4. Limit login attempts

Bots gain access into your site by trying out different combinations of username and password. It may take them many try before they can break in. If we limit the number of attempts that can be made from a single IP, we can totally minimize the chances of bots gaining access.

There are the specific plugin that can implement this task –

  • Limit Login Attempts – It limits the rate of login attempts for each IP. It is a generally used plugin, even if it has not been updated for a longer time.
  • Brute Force Login Protection – Brute Force Login Protection secure your website against brute force attacks via .htaccess.
  • Jetpack Protect – Protects WordPress websites from botnet attacks.

5. Add SSL to your website

SSL stands for standard security technology. HTTP is the HyperText Transfer Protocol for transferring data between a server and a browser. The secure version of HTTP is HTTPS, the “S” standing for Secure. Both of them verify the identity of the website to the user and satisfy the user about the understanding between the website and the user’s browser.

Moreover, if you’ve set up SSL / HTTPS, the server encrypts data and only the user’s browser can break down it. Obtaining yourself an SSL certificate may no longer be optional, in case if you’re using the Chrome browser. This is because Google marks all non HTTPS sites as “non-secure”.

6. Security plugins

Many websites install plugins that take care of WordPress security in an overall manner. They bundle in firewall protection, malware scanning, and whitelisting IPs, monitoring the user activity and mostly all-round security. Both free and premium options are available.

Some plugins that include login protection are:

  • Wordfence – It imposes strong passwords and prevents brute force attacks.
  • iThemes –  iThemes usually fights automated attacks and limits the number of login attempts.
  • All in One Security and Firewall – All in one Security and Firewall prevents brute force attacks and allows IP level blocking, locking out a user after a stated time period.
  • BulletProof Security – For Login and brute force protection.
  • McAfee Secure – McAfee Secure offers multiple layers of protection including malware scanning, and identity protection coverage for e-commerce stores.

7. Two-Factor Authentication

It is one of the most secure ways to protect your website from hackers. However, it works to the standard username/password that you already have. Once you have keyed in these credentials, a code is automatically generated on a device that you have, in your smartphone. Only when this code is entered, do you obtain access to the site.

Many free and premium plugins are available for installation on your website. This security method has been about for a while but is now being applied to website access.

That’s it!

Hope this beginner guide is helpful for you. Still, if you have any WordPress questions feel free to ask us as you can get our expert advice. Our WordPress support team is always ready to deliver WordPress Customer service. Dial our WordPress help number +1 888 614 0555 (Toll-Free).

Read More Blogs:



Leave a Reply