How To Do A Custom Login Box With Wishlist Member

Wishlist Member is one of the absolute best ways to quickly and easily set up a membership site with Wordpress. However, as good as it is, it isn’t perfect. One of the limitations is the lack of ability to customize your login box. Wishlist comes with a widget for a login box which makes it very convenient. The problem is that the code for that login widget is encrypted, so you can’t do anything with it. What’s more, they didn’t bother to add unique CSS identifiers to the fields so you could at least style it yourself. The solution is simply not to use their built-in login widget and do one yourself.

Wishlist Member is one of the absolute best ways to quickly and easily set up a membership site with Wordpress. However, as good as it is, it isn’t perfect.

One of the limitations is the lack of ability to customize your login box. Wishlist comes with a widget for a login box which makes it very convenient. The problem is that the code for that login widget is encrypted, so you can’t do anything with it. What’s more, they didn’t bother to add unique CSS identifiers to the fields so you could at least style it yourself.

The solution is simply not to use their built-in login widget and do one yourself.

The “secret” to it is this: Wishlist is using the same exact login as Wordpress would use even if you weren’t using Wishlist. Plus, Wishlist injects members into the existing Wordpress user database. So, with that in mind, we can simply tap into that and re-create our own login box.

First, at the top of the sidebar.php file of the theme, I include the following:

<?php
global $userdata;
get_currentuserinfo();
?>

The get_currentuserinfo() function will fetch all the information in the database for the logged-in user.

Next, wherever you want your login box to be in your sidebar, use something like this:

<?php if (!intval($userdata->ID)) { ?>
<h1>Inner Circle Login</h1>
<form id="innercirclelogin" method="post" action="http://www.blogmarketingacademy.com/wp-login.php">
<input type="hidden" name="redirect_to" value="wishlistmember" />
<input class="textinput" type="text" name="log" value="Username" onfocus="if (this.value == 'Username') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Username';}" />
<input class="textinput" type="password" name="pwd" value="Password" onfocus="if (this.value == 'Password') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Password';}" /><br />
<input type="checkbox" name="rememberme" value="forever" /> Remember Me
<input type="submit" id="button" name="wp-submit" value="LOG IN" />
<p><strong><a href="http://www.blogmarketingacademy.com/inner-circle/">Register</a> | <a href="http://www.blogmarketingacademy.com/wp-login.php?action=lostpassword">Lost your Password?</a></strong></p>
</form>
<?php } else { ?>
<h1>Welcome, <?php echo $userdata->user_firstname; ?></h1>
<a href="/inner-circle-members/">Member Home</a> | <a href="<?php echo wp_logout_url('http://www.blogmarketingacademy.com'); ?>">Logout</a>
<?php } ?>

In the first line, what we’re doing is detecting if the user is logged in. Obviously, if they aren’t, there will be no user ID defined. In that case, we display the login form. Notice that we can now custom-code our own login form and make it look however we want. And that’s the point. 🙂

If the person IS logged in, then we don’t display the log-in form. Instead, we greet them by first name and provide the basic links that members should see.

This is a down-and-dirty implementation. If you had multiple membership levels and wanted to display different information for each level, then you’d need to have more if/else branches which detect the user’s subscription level.

Lastly, if you’re using a theme framework like Thesis or Headway, I’m really not sure how this would work.

Despite the limitations, I continue to recommend Wishlist Member for Wordpress-powered membership sites.

Free Membership Will Get You...

Ability to participate in our forum community, access to exclusive downloads in the library, plus an exclusive subscription to THE EDGE. Sent each Monday, The EDGE will keep you on the cutting edge of Wordpress-based business.

Responses

  1. wishlist membership plugin is not easy to setup, the main directory once installed cannot be changed so you’re stuck with wishlist-members as the directory! adding custom menus and filters for posts is not straightforward. additional features are seperate plugins at a cost so it’s upselling from the start with wishlist.

    That said it is a good entry point option for a membership website with low initial costs.

    The above information is very helpful 3 years on!

  2. Hello Dave,

    I am not using a sidebar ( duotive theme’s homepage template ). How would I have to set it up to make it work inside a widget? Where would I have to place the code instead of the sidebar.php? Would the call code work in a widget to create the login form?
    Thanks a lot.

  3. Hey David,

    thanks for the great post. Implemented it and it worked great! One small question. Do you have any idea how i can realize a “datacheck” on the loginbox. Because for now, when i hit the submit/login-button without entering any data or incorrect data i get redirected to the /wp-login.php.

    Rather i would like the there shows up some sort of error message, with “sorry, incorrect login” or something like this, you now?

    Any suggestions or ideas?

    Kind regards,
    Alex

  4. This worked really well for me, and I am using the Thesis theme. I inserted the PHP via sidebar widget using the Enhanced Text Widget plugin.

    It’s too bad I couldn’t figure out how to customize my own links in the WishList native login widget. Seems like a missing feature for sure. Thanks for the great tutorial!

  5. I am surprised. WishList is the most clumsy, poorly organized, arcane and problematic pieces of software I have ever regretted using. Nothing but problems, very slow customer support (no chat support either) and convoluted interface.

  6. Thank you very much David. I used your code and it worked straight away. I plugged it into a new Wordpress page template .You're awesome!!!

  7. Thank you for the very useful information. You mentioned having more if/else branches in the code if you have multiple membership levels. Do you know how to test the user's membership level? I've tried all sorts of things and can't seem to find an answer. I would have thought Wishlist Member made some global variable available for this, but I am told they haven't.

  8. I was able to successfully get the login box on my sidebar, and I know that it is logging me in because I am directed to a “protected” page. But on the sidebar, there is no change in login status – it still says “You are not currently logged in.”

    Any ideas?

  9. Very nice, first site I found, I will test this out and report back on if I was successful or not.

  10. Hello… thank you for this code, it has been a real help for me! However, I can't seem to get the logout redirect to work. Has anyone else had this issue? No matter how I alter the redirect, it always takes me to to the default WP login page!

  11. Thanks for posting this, extremely helpful. I had the same trouble trying to configure the wishlist login widget. They need to add a couple more classes to it. Anyway, thanks again!

  12. Great post David! Saved me a great deal of time. I'm working on this exact thing right now for my membership site and you saved me the trouble of having to hack through the code myself. Thanks for pointing me in the right direction.

  13. Being a Nanacast Memberlock lover myself, it has a similar type of login script, so I'm sure this will work. Tried Wishlist for trial version, and decided to keep everything under one roof (membership sites, payment processing, affiliate stuff, etc) with Nanacast.

    David, thanks for posting the actual code you are using.
    Brandon

  14. I've recently started using wishlist and have observed a few limitations…like:

    1. Their internal broadcast facility is good, however since they is no report on the number of emails delivered/bounced as the sender you're left with questions than answers.

    2. Cannot send a test message before broadcasting a message to your mailing list.

  15. I see great stuff like this all the time about WP and it always makes me wonder if I went with the right platform or not. I love Squarespace, I mean they have probably the best support I've ever encountered with any business but there's not too many people that write about it. Any thoughts?? I just saw your Tweet too…man I have to get in on that Inner Circle.

  16. I'll have to try this on my Wishlist site – my low-key solution was just to make an image that said “Click here to login” and linked it to the /wp-admin/login.php page.

Join The Community (For Free). You'll Get...​

Related Articles You Might Like

Create Your FREE Account!

Join and participate in the community, access exclusive resources in the Document Vault, and get a free subscription to THE EDGE.

Your membership is free for life.