psignoret / aad-sso-wordpress

Single Sign-on with Azure Active Directory (for WordPress)
Other
266 stars 79 forks source link

For those struggling with custom login page #228

Open 8biteric opened 4 years ago

8biteric commented 4 years ago

I am working on a private corporate intranet built in Wordpress, using Azure for logins. This plugin worked perfectly, outside of my attempt at a custom login page. I was running into antiforgery issues as detailed in https://github.com/psignoret/aad-sso-wordpress/issues/159.

I wanted to bypass wp-login.php probably for reasons similar to others – didn't want to confuse people with two options to login: do they enter their credentials in the wordpress fields, or do they click the Sign In Using Azure link?

Tried everything to get around wp-login.php, but i gave up – was on a crunch and had to move to Plan B quickly. So for those in a similar boat, here's what I did:

1) Added the following code snippet to my header. Redirect code is there in case people request a specific page without being logged in.

<?php
$actual_link = "https://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";

if ( !is_user_logged_in() ) {
    wp_redirect( '[YOUR URL HERE]/wp-login.php?redirect_to=' . urlencode($actual_link) . '');
} else {
    echo '<!-- User is logged in -->';
}
?>

2) Used Peter's Login Redirect to forward all users elsewhere once they logged in. This was to prevent users from ending up at the Wordpress dashboard. (Note: you'll need to make sure "Allow a POST or GET "redirect_to" variable to take redirect precedence" is set to Yes, so that redirect in the code above is respected.

3) I modified the hell out of wp-login.php, and simply hid all the stuff I didn't want users messing with (pretty much everything but the Azure sign-in link). This function will get you there:

function hide_login_elements() { ?>
    <style type="text/css">
        body.login { background-color: #000; }
        body.login h1 a { background-image: url([CUSTOM LOGO URL GOES HERE]; background-size: 320px; width: 320px; }

        .aadsso-login-form-text a { color: #f2b41c; line-height: 2em; }

        body.login div#login p#backtoblog, body.login div#login form#loginform input, body.login div#login form#loginform p label, body.login div#login form#loginform label,
            body.login div#login form#loginform p.forgetmenot, body.login div#login form#loginform p.submit input#wp-submit,
            body.login div#login p#nav a { display: none; }
        body.login .button.wp-hide-pw { display: none !important; }
        body.login div#login form#loginform { background-color: #222; border: 0; }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'hide_login_elements' );

That's pretty much it. Things seems to be working well. We're not live yet, and if there's any bugs that pop up, I'll be sure to post them here.

i-am-dan commented 4 years ago

Hey. Thank you so much for this! I'm having issue understanding how to use the apply_filter('authenticate'). Don't I need to call this hook for me to get the access token? If so, where do I place this code? I see that you don't have anywhere on your code.

Thank you!

EDIT: So you are not using a custom login page?