How To Control Login and Logout For Your Membership Site

One of the core things when building your WordPress membership site is setting up the login and logout process. How do you style the login? How do you control where members go once they log in? How do you give them login/logout options in the navigation menu?

In this part of our series, I’ll cover how this is done and the tools I use to do it. There are a lot of tools available, but we’ll focus on the way I usually do it.

Transcript Of This Video

[00:00:01.07]
So when you’re building your membership site, how do you control the login and the logout process? How do you make it look decent? How do you control where they go? Well, that’s what we’re going to talk about in this video. Now, a lot of membership site plugins out there, they handle user logins in their own way. A lot of times when you install them, they will inject these automatic login, logout pages. And so you have those login and logout pages sitting in the pages list. Plus, a lot of these membership site plugins have separate screens for their lists of members. But the thing is, that’s not the way that I am building the membership site, and it’s not the way that I’m showing you how to do it here. What we’ve been talking about, as you can see, is using Fluent CRM or some other CRM, but in combination with WP Fusion. And when you use WP Fusion, things are done a little bit differently. It gives you a much more powerful membership site than you’re going to get in a lot of cases with other tools. That being said, because it’s not one plugin, you’re using a few plugins that do the best at what they do and bringing them together, it’s a little bit different.

[00:01:18.07]
With WP Fusion, we are actually using directly the WordPress user profiles, the built-in capability of WordPress user profiles. And that’s where you manage them. I mean, basically it’s going to be between the WordPress user profiles and the profile inside of your CRM, and WP Fusion is going to just link them together. Okay, so with that being said, let’s go ahead and talk about how to control this login process in this instance in the way that we’re doing it. Now, as I mentioned, members are going to be getting standard WordPress user profiles. Now, most other membership site plugins, that’s the way they work, too. It’s just that they don’t look like it because they create their own member list screens and they manage things in their own proprietary way. We’re just simply using the standard user list, and that’s how it’s going to be done. Now, when they log in, they’re going to be using the standard login process of WordPress. Basically, the same one you use in order to log in as an administrator and get into the back end of the site. Except their permissions are going to be different, of course, so they’re not going to go inside of the WordPress admin.

[00:02:25.24]
In fact, they won’t even know WordPress is there in most cases. They’re They’re going to go to a different screen, some type of a member dashboard or something like that. But they’re using the exact same login process that you do, and it just makes things simpler that way. We don’t need any different login type stuff. So basically, this is what they’re going to be using. It’s the standard setup. Now, again, we don’t like the way it looks. It’s got the big WordPress logo at the top, but that’s a different matter. We just use a plugin in order to style this login and make it look like what we want, but it’s exactly the same login. So obviously, you’re going to want to control how that looks, like I said, so it doesn’t look like they’re logging into WordPress. When this is done right, you can’t even tell you’re logging into WordPress, but they are. They’re not even going to know WordPress is there, and that’s the way you want it. Now, one of the other tools that we’re using in our stack here is Woocommerce. And I should also mention that Woocommerce has the My Account screen, and you can put a login form directly on that.

[00:03:27.27]
In fact, it’s there by default. If If a person who’s not logged in, tries to visit the My Account screen, it’s going to show them a login, unless you specifically disable that feature. And so that is one way that you could do it if you’re using Woocommerce, is just link everybody to the My Account screen, whether they’re logged in or not logged in. And if they’re not logged in, they’re going to see a form, and it will just automatically work. And in fact, Woocommerce has that pretty well set up in the fact that if they use that form, it will just automatically send them to the My Account screen after they’ve logged in. And as you’ll see in my next video, when we start talking about building a member dashboard, I’m actually a pretty big fan of using the My Account screen as the dashboard, and we just modify it so it really looks nice. But we’ll get to that a little bit later. Okay. Now, many people, they like to create separate pages, and they build these login forms onto them. And I’ve seen that in a lot of membership sites. They will actually create or plugin will create for them a page that says login, and they’ll drag some element or login form widget on there or something like that.

[00:04:40.17]
The truth of the matter is, there’s no need for that. And in fact, I think you’re just adding more complexity to your site when you go and build your own login screens like this. Really, the only reason you might ever want to do that would be if you really, really have a very specific thing you’re going for with the way that login screen works. Otherwise, I really encourage you to keep it simple and just use the standard WordPress login that everybody else that you use. And then we just style it to make it look okay. So the simple method The idea is to use the standard login, as I mentioned. Change the URL, so it’s not Wp-login, but it’ll be something like /login, something like that. We don’t want the WordPress URLs in there. And then we just use some type of a plugin to make the login form look good. It’s really easy. Now, one other thing I will mention here is that we don’t want to forget the log out. A lot of membership sites forget the log out. If people do log out, it just routes back to the homepage or something like that.

[00:05:48.19]
But you can actually redirect them to a page when they log out. A lot of members are not going to log out. They’ll just leave, and then they come and they’re already logged in because they have a cookie set up on their browser. But if they do log out, you want to send them someplace that makes sense. Now, one thing that I like to do is use a log out page and direct them to it. This actually is a screenshot of what mine looks like at Blog Marketing Academy, and it’s real simple. It just says, Hey, you’ve been signed out of your account. I’m nice and friendly about it. And I say, Hey, did you catch these latest blog posts? I’ll just show my latest post from blog. But what you do with your log out page is completely up to you. You could create some type of an offer, something that they may not know they could purchase. I mean, whatever you want to do with that. But the idea is that it is a piece of real estate, and you might as well use it. All right. So lastly, you’re going to need to put login and log out options in the NAV menu.

[00:06:55.10]
That’s something that needs to be done. It’s not built into WordPress on its own. And so I will show you how to do that. You want to make sure that when they’re not logged in, that the header shows them a link to log in. And then if they are logged in, that the header menu gives them a way to come out of their account. Okay? And it’s pretty simple to do, and I’ll show you how to do it. So with that, let’s go ahead and start talking about some tools. Now, like most things WordPress, there are a lot of different ways to go about this stuff. When you start searching the plugin repository, you’re going to see all kinds of different options. And I’m not I’m here to tell you what to do, but I am here to show you how I do things, okay? And so that’s what I’m going to focus on. I’m going to show you one plugin that’s just nice to know that it’s there that I do not use. But then I’m going to show you a couple of options that I do use, and we will go from there.

[00:07:45.20]
But there are lots of these things. There’s plugins out there that can add the login and log out option to your NAV menu. There’s various plugins out there for being able to style the WordPress login and make it look the way that you want. There’s various ways, including little manual code snippets you can stick into WordPress that can determine where people go when they log in. There’s all kinds of different stuff. But let me just show you how I do it because I think it’s a little simpler and you can make of it what you will. Okay, so first for the one I don’t really use all that much, but it’s certainly as popular, and that is LoginWP. You will find this in the plugin repository as well. The free version is right here in the repository. So if you just search for login WP, it’s called formerly Peter’s Login redirect. Much better that they renamed it because that was a horrible name. But Anyway, this is the official site here. They do have a pro-version that allows you to do every darn thing you’d ever want to do. But this is a great plugin because it allows you to do all kinds of really granular redirection based on when they log in, you can send them off to different pages.

[00:09:04.19]
You’ve got a lot of control. It integrates with all kinds of different membership site platforms out there. It is a pretty nice plugin overall. So it’s something that you might want to check out, but it’s not what I use myself. So let me show you the two options that I do use. The first one is called Admin and Site Enhancements. Now, what this plugin does is a multitude of things, and that’s why it’s so handy. I’m a big fan of installing plugins that can do what I want to do without a lot of bloat. The other thing is that when I find a plugin that doesn’t have a lot of bloat, but does a whole lot of things, I’m really happy about that. And Admin Site Enhancements is definitely one of them. It is a paid plugin, but it’s certainly not very expensive. You can see the pricing here. They do have a free version, which may actually I actually don’t know if the login styling options is one of the things that would require. See, login page customizer. Yeah, it looks like you would need the pro version for that. But what I use this plugin for, along with a lot of other different things is that I can style the login, I can stick the site logo up there, I can give it different color schemes, I can also control where people are going to go when they log in and when they log out.

[00:10:29.05]
It can automatically put things into the NAV menu for login and log out. It’s just a very useful plugin in a multitude of ways, but one of which is to be able to do the things that we want to do with our login process. So I use this plugin a lot, and it’s definitely something that you should check out. The other one being that we are talking about building WP Fusion sites is their add-on called Logins. It’s an add-on for WP Fusion WP Fusion. You do need to have the proper license level of WP Fusion to have access to that. But this thing is granular, and I really like it in certain instances. You can see in this screenshot. Basically, what this will allow us to do is that based on the tags that they have, we can actually direct them anywhere that we want. Which means if you have different member levels with different tags, we can actually direct each type of member to their own page. You could even do things if you tag people that might be getting a particular promotion right now, some evergreen promotion that only some subset of your users are getting, you can add that tag.

[00:11:41.27]
Then when those members log in, you could direct them to the sales page directly. Then, of course, when you remove that tag, they would no longer be directed like that. You’ve got redirect rules in here with a hierarchy, so it’s from top to bottom. You can drag and drop. This is very useful add-on for WP Fusion, and that’s definitely one that I use when I need more granular control. Sometimes one dashboard is plain. Sometimes you want to have more finetuned control, and that’s when I start using the WP Fusion Logins add-on. Okay, and lastly, let’s go ahead and actually do something here. We’re in my practice membership site that we’re putting together here. Now, you can also see that in between videos, I’ve imported some default templates. These were basically created using Cadence, but it’s basically an AI auto-generated theme because we’re not going to spend too much time with real content. This is just for testing purposes, right? That’s what it actually looks like. Now, what we’re going What we’re going to do is we’re going to actually style up the login. I’ve installed the Admin Site Enhancements plugin that I just mentioned. It’s under Tools, you go to Enhancements.

[00:12:55.27]
You can see that this plugin allows us to do all kinds of different things. It’s almost like Christmas sometimes, going through some of the things that this plugin can do for us. But what we’re interested here is to go to Login/Logout, and we’re going to make a few changes. First of all, we do want to change our login URL. Let’s expand that, and let’s say login. Redirect default URLs. This is what happens if people… Let’s see. Actually, I don’t even know. I don’t even use that option. This feature only works for We’ll just leave that alone for now. Then let’s go ahead and save this. Now, we’re not done, of course, but what we’re going to do, let me open up a private browser window because you can’t be logged in to see your login screen. Let’s see if that works. Okay, there we are. See how it goes directly to our login page. But of course, it is very default. So let’s go back to where we are. Let’s go to our login page customizer. Now, what we’re going to do here, let’s go ahead and choose a logo. I think I imported some default logo here.

[00:14:09.27]
Let’s just play with one of these. Who cares? Let’s go with that one. We can change the sizing of it if we want. Let’s go ahead and go with this background of blurry blue as just a default, but we can get really granular with the custom CSS if we’d like. Let’s go and hit changes. Now, Now, let’s see what this looks like now. There we go. We were already different. We’ve got our logo. It’s a little on the small side, so we probably wanted to expand that, but we can tweak this thing. Let’s go back on in there. Let’s make this a 300 pixel. Let’s just see. I don’t even know if that image that we put in there is big enough for that. Let’s just see. Oops, wrong browser window. Where’d it go? I don’t think that’s actually going to work. Okay, stand by. Let’s see what other logos we have. Why didn’t I import something better than that? Some other fake logos in here. Maybe I can upload my own logo. All right. Yeah, okay. Basically, these image files are not the right dimensions for me. How about we do this? We are going to go in and let’s see what this looks like.

[00:15:49.24]
Concierge Hosting. I don’t use this logo anymore, but you get the idea. Let’s go ahead and stick that on there. Okay. Logo is a little bit better. If we go on back, we’ve got different color schemes here. The pattern blue, we’ve got gray, we got stacked stuff. You got different pre-made ones. Then If you wanted to get really granular with it, you could drop down here into the Custom CSS and do it that way. Maybe we want to hire the language switcher, whatever you think you might want to do, login form background. Let’s see what this actually looks like. I see what it did there. But we could play with it. You know what I mean? In some cases, this might actually look good, but you get the idea here. Now, the other thing that’s really nice is, let’s go down to here. This is the Login and Logout menu. What this actually does, we’ll add options into our menu builder that will change, and then we can drag it into one of our NAV menus, and It will automatically say login or log out based on what that user status is. The other handy feature are these redirects, redirect after login.

[00:17:10.03]
If we do that, it could be a single URL for everybody, or it can be based on roles, and subscribers would go to a different one, like dashboard or something like that. Then when we talked about the log out redirect, you got the exact same options here for being able to direct people to a URL on your site when they actually log out of your site. With that Login/Login option that we just enabled with the plugin, now you got in your menu builder, you actually have this option here. We’re going to go ahead, and just for demo purposes, we’re going to add that to our menu. I’ll just leave it there for now. Let’s go ahead and hit Save. Now, in this browser, I am logged in. You can see that now we see a Log Out option. Over here, I’m in a private browser window, so let’s go on back to our main page. Let’s refresh that. Actually, we got to clear the cache because that sometimes happens. Let me take care of that real quick. Okay, and now you can see that the cache is clear. We see a Login option here, and when we click on that, it goes over to our styled up login that we just did.

[00:18:24.11]
So that was all done using the Admin Site Enhancements plugin. Now, if we go back, there are, like I multiple ways of doing the same thing. So one other option, if we’re using Cadence, which is the theme that I like, so that’s why I won’t spend too much time on this, but you can go to the Customizer and you can build these things into the top using buttons and all kinds of really handy-dandy things. So if we go over to the Header Builder here, one of the options you could do is drag this account thing over here, and you get the nice little profile link And then on that, you can control with a logged in view what it actually looks like, what icon. If you want a label in an icon like this, you can call it my account. You can link it to a menu. You could link it to a particular page, which is what I often do, where I will either send this to a dashboard or to my account for like, Woocommerce, something like that. And you got it, of course, you can see it needs to be changed on the color.

[00:19:30.23]
Basically, you can go through in this and make it so that this looks like a nice button. And then in that case, what you would do is not use the login/logout option that’s built into the actual menu because you will have it like that instead. And we can style this up to look like a button and do whatever we want. So sometimes your theme actually does provide nice options for that. All right, so that’s basically the gist of doing the login and log out process. Now, as I mentioned, as often, there are many different ways of doing this stuff. Lots of different plugins, lots of different approaches to getting the same thing done. The simplicity of it, though, here is that in this case, we’re using the standard WordPress user system, the same one that you’re in as an administrator, they’re going to be in as a subscriber. That’s going to be their user role, okay? Because we’re controlling permissions and everything using tags with WP Fusion. So they’re just going to be logging into their user profile. So we need to have a login link in the top menu, also a log out. If the log out is not in the top menu, you might want to have it on their account dashboard at the very least, but you should give people a log out option.

[00:20:46.00]
When they get to the login screen, you want to make that login screen look acceptable. You don’t want it to look like default WordPress. I showed you the way that I do that. But of course, there are other ways, and you can look at that in your own if you’d like to do And then the next thing, of course, is where to send them when they actually log in. Now, we talked about that a little bit in this video, but in the next video, we’re going to go a little deeper into that because we’re actually going to put together a member dashboard. And of course, like with most things, there are multiple ways to go about that one as well. But that’s the gist of this. It’s actually not complicated. And if you find other tools you’d like to use to do it, that’s fine as well. But I do I encourage you to keep things simple. Don’t install a whole host of plugins just for something as simple as styling up your WordPress login. It’s like you don’t need to overthink this stuff. The standard WordPress login works just fine. Just stick your logo at the top of it.

[00:21:47.14]
If you want to change the button colors a little bit to fit your brand, that’s fine. But there’s just no need to overthink this stuff. I know a lot of people, they waste too much time trying to make their site look like some other sites that they seen, and it’s just not that important. Let’s focus on the things that matter here. Let’s get ourselves a membership site that’s built and is functioning. Before we end off here, I should mention, of course, this series on YouTube for building a membership site. We’re getting into some details. I’m showing you how to do things. It can seem a little long because this is basically a free training course. I’m just doing it on YouTube. But if you just don’t want to deal with this stuff on your own, this is the thing I all the time, okay? And so I can actually do it for you. I’ve got all the plugins handy. I do it in my sleep, basically. And so if you’d like my help putting your membership site together, come hit me up, get in touch, book a call with me, and we can talk about it.

[00:22:45.28]
Just head on over to blogmarketingacademy. Com. You could book a free road map call with me, and I’d love to have a quick conversation with you about what you’re looking to do and how I might be able to help you do it. All right, with that said, I will see you on the next video in the series. We’re going to start talking about member dashboards.

Duration

23m 5s

Date Published

September 25, 2024