Play Video

One of the drawbacks you might experience in developing your restaurant platform is not having a login page that looks beautiful and is different from the WordPress login page.

Fortunately, in this lesson, we will show you how to build your own login page for WordPress. This page will have your own design and your own URL.

1- Create a custom login page for your WordPress platform

We’ll create this custom login page on the network’s main site.

It’s important to create the custom login page in the main site, because the single sign on provided by WPUltimo won’t work if you log in on a subsite.

Go to Network Admin > Sites and open the main site’s dashboard.

Once you’re on the main site, please go to Pages > Add New to create a new page.

We’ll call this page something like “Login” and hit Edit with Elementor.

wordpress custom login page

Once you’re in the Elementor editor, you need to go to Settings and select Elementor Canvas in Page Layout.

wordpress custom login page

The basic structure of this custom login page we’re creating will contain our platform’s logo and the login form.

Therefore, you need to add two elements:

  1. An image element for the platform’s logo
  2. A shortcode to display the login form.

wordpress custom login page

Once you’ve entered both elements, you need to add this shortcode to display the login form on this page:

[wp_frontend_admin_login_form]

wordpress custom login page

It’s important to mention that you won’t see the login form because you’re already logged in.

However, this is how your custom login page will look when you’re not logged in.

Note – This is a really simple design, but you can design your frontend page, adding all the elements you want. You can display the login form wherever you want.

wordpress custom login page

Now it’s time to define this custom login page as the default login page of your platform.

  1. Head to Network Admin > Dashboard > WP Frontend Admin > Settings > Login.
  2. Paste the URL of your custom login page in the Login Page URL (optional) field.
  3. Scroll down and hit Save to apply the changes.

Now all your users will be sent to this page. And something great is that in future sessions we’ll show you how to add a login button to the homepage of your platform that will redirect users to this custom login page, so they won’t even know you’re using WordPress to build this platform. 😉

2- Optional – Create an “Upgrade plan” page for your restaurant platform

This is for users who are creating a platform with 2 or more WP Ultimo membership plans.

WP Frontend Admin allows you to block pages and sections of the global frontend dashboard based on the WP Ultimo membership plan purchased by the user.

Therefore, we need a page to which users are redirected when trying to view a page that is not available for their plan.

Go to Network Admin > Sites and open the dashboard site.

wp ultimo upgrade plan

Now go to Pages > Add New to create a new page.

Add the page title and hit Edit with Elementor.

wp ultimo upgrade plan

Once you’re in the Elementor Editor, head to Settings and select Elementor Canvas in the Page Layout field.

wp ultimo upgrade plan

On this page, we’ll include three basic elements:

  • An image element for the platform’s logo
  • A message telling the users they need a higher plan to view the page
  • A button asking them to upgrade

The button must redirect users to the Settings frontend dashboard page so that they can access their Membership options to view their membership information and upgrade their plan.

wp ultimo upgrade plan

Note – You can design this page as you want, adding your own colors, images, texts, typographies, etc. Also, you can include a link to take the users back to the frontend dashboard if they don’t want to upgrade their membership plan.

Now let’s set up the “Upgrade” page as the Wrong Permissions Page so that users be redirected to that page each time they try to view a page not available for their membership plan.

  1. Head to Network Admin > Dashboard > WP Frontend Admin > Settings > Access Restrictions.
  2. Paste the “Upgrade” page URL in the Wrong Permissions Page URL (optional) field.
  3. Scroll down and hit Save to apply the changes.

wp ultimo upgrade plan

Now your users will be redirected to this page when they try to view and use a page that is not available for their membership plan.

wp ultimo upgrade plan

In the next lesson, we’ll learn how to create a WP Ultimo template site for users to configure their sites with one click by cloning this template site.

TIP

If you have a premium license of WP Frontend Admin, you can download the full backup of our restaurants platform, so you can import it on your site and everything shown in this course will be already configured for you. It will save you a lot of time.

Close