In this lesson, we’ll show you how to create a custom login form for your multisite network. This is great because your users won’t have to use the normal WordPress login page. Instead, you’ll design a beautiful login form with Elementor.
Follow these steps to create your custom login form:
1- Add a new page or edit the default login page from WP Ultimo
In their new update, WP Ultimo includes the option to create default registration and/or login pages. These are normal pages with the appearance of the theme you have installed on your main site.
If you don’t want to create a new page, you can open the default login page and edit it with Elementor. This has some advantages such as not having to change anything else because WP Ultimo will recognize the login page automatically.
Go to Network Admin > Sites and open your network’s main site.
Now go to Pages and add a new page or open the default login page.
If you create a new page, add the page title and hit Edit with Elementor.
If you’re editing the default WP Ultimo login page, cut the shortcode and hit Edit with Elementor.
2- Add the WP Ultimo login shortcode to your page
Once you’re in Elementor, you can change the page layout to Elementor Canvas. Add all the design elements you want such as a background image, texts, columns, etc. Design the page as you want.
The essential element on this page is the WP Ultimo login shortcode:
[wu_login_form]
You need to paste this shortcode where you want to display the login form.
3- Make sure the page is selected in the WP Ultimo settings
If you’ve edited the default WP Ultimo page, you don’t need to do anything else.
But if you have created a new page, go to Network Admin > WP Ultimo > Settings > Login & Registration, and select the login page in Default Login Page.
Once you save the settings, this is what your login form could look like:
Now your users will log in to their accounts using a beautiful page instead of using the normal WordPress login page.
In this lesson, we’ll learn how to create a custom login page for your multisite network using Elementor free and WP Frontend Admin.
This page will be completely different from the WordPress login page and will contain your logo, your background, and your preferred colors.
Note – This page must be created on the frontend dashboard site.
Go to Network Admin > Sites and open the frontend dashboard site’s admin panel.
Now just follow these steps:
1- Create a new page on your global frontend dashboard site
Once you’re in the wp-admin panel of the dashboard site, go to Pages > Add New.
Enter the page title and click Edit with Elementor.
2- Edit the custom login page with Elementor
Once you’re in Elementor, let’s change the page layout into Elementor Canvas.
You can design the page as you want by adding any of these elements:
- Plaform logo
- Page background
- Page heading
- Columns
- Texts
- Images
- Etc.
The essential element of that page will be the login form shortcode that WP Frontend Admin allows you to display on any page:
[wp_frontend_admin_login_form]
Once you add the shortcode to the page content, you can publish the page.
Note – While editing the page, you won’t be able to view the login form.
Once you publish the custom login page, this is what it could look like:
3- Set up this page as the default login page in WP Frontend Admin
Now you need to add a “Login” button on the homepage.
- Go to Network Admin > WP Frontend Admin > Settings > Login.
- Add the URL of your Login Page in Login Page URL.
- Save the changes.
After these simple steps, every time users try to go to the normal Login URL, they will be redirected to this page. Your users will no longer have to use the normal WordPress login form.