Front End Registration and Login

[Henry]

How can I create a front-end registration and login page for s2Member instead of using wp-login.php

I know I could use .htaccess to mask wp-login.php but, I want to protect my backend and I want to have the registration and login process to be a part of my website so the transition is seamless. Is there a way to do this using WP/s2Member hook and filters?

[Jason Caldwell]

Hi Henry. Thanks for the great question.

Here are two ways to accomplish this:

1. You can build a form into your theme, or into a specific Post or Page that you've created. Have that form submit all the same fields to: /wp-login.php?action=register ( this would give you additional control over the cosmetics ).

2. You can upgrade to s2Member Pro. The s2Member Pro Module makes it possible for s2Member to use PayPal® Pro Forms ( instead of standard PayPal® Buttons ). PayPal® Pro Forms integrate seamlessly with WordPress® Shortcodes. This allows you to keep Customers on your site at all times, and it consolidates the Checkout / Registration steps into a single form that you can dress up just the way you like.

The s2Member Pro Module, also includes a Shortcode for each type of Form, even for free registrations, where no payment is required, for Level #0 access.

but, I want to protect my backend

Just to point out. The wp-login.php file is not part of the WordPress backend.
I realize that it is primarily intended for admin access ( by default, without s2Member ), but the /wp-login.php file resides outside the /wp-admin/ directory. So it IS safe to use that.

[Henry]

Jason,

My goal is to have members stay on my site without having to view the WP dashboard so they don't have to go to wp-login.php, I want a seamless transition from registration to editing their user profile, having them stay on the front-end of the site to register and manage their account.

What hooks should I use to create such a form? Where would I find them?

Can I integrate your existing Edit User profile page without using an iframe?

[martonic]

Hi Henry. Thanks for the great question.

Here are two ways to accomplish this:

1. You can build a form into your theme, or into a specific Post or Page that you've created. Have that form submit all the same fields to: /wp-login.php?action=register ( this would give you additional control over the cosmetics ).

Hi Jason,

You can do this, but then the Login Page still has a "Register" link at the bottom, which leads to the "usual" registration page.

Is there a good way to get rid of that - or better, make it point to my Custom Registration Page?

[Jason Caldwell]

Thanks for the great question.

or better, make it point to my Custom Registration Page?

Yes. Inside the functions.php file for your WordPress theme, you can add these lines:

Code: Select all

<?php
add_action("init", "redirect_registrations"); function redirect_registrations()
    {
        if(preg_match("/wp-login\.php/", $_SERVER["REQUEST_URI"])
           && $_GET["action"] === "register")
            { header("Location: [YOUR CUSTOM URL HERE]"); exit(); }
    }
?>

Change the part that says: [YOUR CUSTOM URL HERE]

[martonic]

Ah so - thanks!

[Henry]

You could extend it to include: login, lostpassword too, correct?

Code: Select all

<?php
add_action("init", "redirect_registrations"); function redirect_registrations()
    {
        if(preg_match("/wp-login\.php/", $_SERVER["REQUEST_URI"])
           && $_GET["action"] === "register")
            { header("Location: [YOUR CUSTOM URL HERE]"); exit(); }
    }
add_action("init", "redirect_lostpassword"); function redirect_lostpassword()
    {
        if(preg_match("/wp-login\.php/", $_SERVER["REQUEST_URI"])
           && $_GET["action"] === "lostpassword")
            { header("Location: [YOUR CUSTOM URL HERE]"); exit(); }
    }
?>


[Jason Caldwell]

Absolutely. Thanks for that additional post.

[martonic]

Thanks for the great question.

or better, make it point to my Custom Registration Page?

Yes. Inside the functions.php file for your WordPress theme, you can add these lines:

Code: Select all

<?php
add_action("init", "redirect_registrations"); function redirect_registrations()
    {
        if(preg_match("/wp-login\.php/", $_SERVER["REQUEST_URI"])
           && $_GET["action"] === "register")
            { header("Location: [YOUR CUSTOM URL HERE]"); exit(); }
    }
?>

Change the part that says: [YOUR CUSTOM URL HERE]

(EDITED)

Hi again Jason,

I did this, but the "custom registration page" does not work at all.

When submitted, it just resets the form to all blanks - and reloads the page.

It did work, until I added the "redirection code" above. Although that DOES make the registration link redirect - it also makes the custom registration page fall down.

Any suggestions?

[martonic]

SOLVED

Here is the code you need for the hook:

Code: Select all

add_action("init", "redirect_registrations");
function redirect_registrations() {
    if(preg_match("/wp-login\.php/", $_SERVER["REQUEST_URI"])
       && $_GET["action"] === "register" && $_GET["register"] !== "1")
    { header("Location: /bg-register.php"); exit(); }


Note the addition of:

Code: Select all

&& $_GET["register"] !== "1"

This additional test is needed because the same file and the same action are used both to present the registration form, and to process it!

Then, in your custom registration form, use this action:

Code: Select all

action="/wp-login.php?action=register&register=1"


You also need the following in your custom registration code, inside the form itself:

Code: Select all

<?php
    echo '<input type="hidden" name="ws_plugin__s2member_registration" value="' . esc_attr (wp_create_nonce ("ws-plugin--s2member-registration")) . '" />' . "\n";
?>


To have the function wp_create_nonce() available, you need to include pluggable.php.

Finally, you also need to supply your own Javascript form validation.

Whew!

[martonic]

The "custom registration page" is harder than I thought.

Even after all the above, when you put in a name that is already in use, or a bad email, the function still redirects to the "usual" log-in page with the error messages attached.

Drat!

[Jason Caldwell]

If you can't get that working "exactly like you want", you may want to consider using these functions to accomplish a truly "100% custom" registration system, while still maintaining compatiblity with s2Member.

You can use these functions for that:

Code: Select all

$id = wp_create_user(login, pass, email)
wp_new_user_notification($id, pass)

Check the WordPress® Codex for further details.
OR, you can have a look at paypal-checkout.inc.php
in the s2Member Pro distribution for actual examples.

In short, the `wp_create_user()` function will fire the "user_register" Hook in WordPress®, which triggers s2Member as well. So if you POST data to a custom processing routine that receives form input, and calls `wp_create_user()`, you've got a truly custom integration.

[martonic]

Hi Jason,

Thank you very much. I wound up using a custom page that posts to itself, thus removing WP from the equation completely - creating a password, entering the user in the database, including the s2Member fields, and sending their email "by hand". At least it provides full control over all the details - although, as you imply, it might not work correctly down the road if "things change".

[Jason Caldwell]

Hi Jason,

Thank you very much. I wound up using a custom page that posts to itself, thus removing WP from the equation completely - creating a password, entering the user in the database, including the s2Member fields, and sending their email "by hand". At least it provides full control over all the details - although, as you imply, it might not work correctly down the road if "things change".

That works too. Glad to hear you got it working.