wordpress authentication - redirect after incorrect login

 

[caption id="" align="alignright" width="300" caption="Image via Wikipedia"]The logo of the blogging software WordPress.[/caption]

Few days ago I had to deploy a simple wordpress installation for a project at @therumpusroom_ with my buddy @twentyrogersc. Super simple, yet it presented a little issue: having a personalized authentication form, displayed on a wordpress page, it was re-directing to the default login screen after specifying incorrect credentials. It came out that we needed to implement the whole authentication mechanism on a page, hence tweaking the simple post form to send data to itself instead of submitting to wp-login.php (which, btw is working fine if users provide the correct credentials, and also accept a redirect parameter to make users land on a pre-determined page).

Just for my records, I leave the code here, and I hope I could save some time to people who incur in the same problem. Here's my solution:

  1. from the dashboard create a page and give it a meaningful permalink, such as log-in
  2. create a php file and give it a name according to the wordpress convention: page-<permalink>.php (in my case: page-log-in.php)
  3. write the php code to perform the whole authentication (hence including password check and signon), this is my code:
    <?php
    	// if user is logged in, redirect whereever you want
    	if (is_user_logged_in()) {
    		header('Location: '.get_option('siteurl').'/how-to');
    		exit;
    	}
    
    	// if this page is receiving post data
    	// means that someone has submitted the login form
    	if( isset( $_POST['log'] ) ) {
    		$incorrect_login = TRUE;
    		$log = trim( $_POST['log'] );
    		$pwd = trim( $_POST['pwd'] );
    
    		// check if username exists
    		if ( username_exists( $log ) ) {
    			// read user data
    			$user_data = get_userdatabylogin( $log );
    
    			// create the wp hasher to add some salt to the md5 hash
    			require_once( ABSPATH.'/wp-includes/class-phpass.php');
    			$wp_hasher = new PasswordHash( 8, TRUE );
    			// check that provided password is correct
    			$check_pwd = $wp_hasher->CheckPassword($pwd, $user_data->user_pass);
    
    			// if password is username + password are correct
    			// signon with wordpress function and redirect wherever you want
    			if( $check_pwd ) {
    				$credentials = array();
    				$credentials['user_login'] = $log;
    				$credentials['user_password'] = $pwd;
    				$credentials['remember'] = isset($_POST['rememberme']) ? TRUE : FALSE;
    
    				$user_data = wp_signon( $credentials, false );
    				header('Location: '.site_url('how-to'));
    			}
    			else {
    				// don't need to do anything here, just print some error message
    				// in the form below after checking the variable $incorrect_login
    			}
    		}
    	}
    
    	// and finally print the form, just be aware the action needs to go to "self",
    	// hence we're using echo site_url('log-in'); for it
    ?>
    <?php get_header(); ?>
    
    	<h2>log in</h2>
    	<form action="<?php echo site_url('log-in'); ?>" method="post" id="login-form">
    		<label for="log">User</label>
    		<input type="text" name="log" id="log" class="text" value="<?php echo wp_specialchars(stripslashes($user_login), 1) ?>" size="20" />
    
    		<label for="pwd">Password</label>
    		<input type="password" name="pwd" id="pwd" class="text" size="20" />
    
    		<label for="rememberme"><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> Remember me</label>
    
    		<input type="hidden" name="redirect_to" value="<?php echo get_option('siteurl'); ?>/how-to" />
    		<input type="submit" name="submit" value="log in" class="button" />
    	</form>
    <?php
    	// incorrect credentials, print an error message
    	if( TRUE == $incorrect_login ) {
    ?>
    		<div class="incorrect_login">Incorrect login details. Please confirm the fields and submit it again,
    		or <a href="<?php echo site_url('contact-us'); ?>">contact us</a> to obtain a set of credentials.</div>
    <?php
    	}
    ?>	
    
    <?php get_footer(); ?>
  4. and finally load this php file where your wordpress theme lives, it's done!

Range Rover Evoque Interactive Installation - phases and pictures

So the Range Rover Evoque "Sounds of the City" project went live in Madrid at the beginning of June, and it has been a long and interesting path that eventually lead to a red carpet in Kensington, London.

range rover evoque in kensington - red carpet

I was involved as interactive producer for the installation and microsite, working with the amazing guys at The Rumpus Room for the agency The Brooklyn Brothers. We designed, developed and built all the interaction for the interactive installation and relative microsite, then shipped and attended to the events in Madrid and London with our buddies at Connect Live, who took care of the physical build of the plinth and all the logistic.

Below is the story of the installation development and deliver through a sequence of images.
range rover evoque - building the prototypePlinth prototype, assembling the interactive installation at Connect Live warehouse in Surrey.

interactive plinth - placement of projectorsFinding a solution for a short throw from the projectors inside the plinth.

interactive plinth - computer vision + 360 lens testsTesting the gigE camera with fish-eye lens and NIR filter for motion detection algorithms and 360 lens to record the events (published on the microsite).

range rover evoque - dancing sessionsThe installation working in Madrid, even under full sun light!

lord sugar - hope I won't be fired...The interactive wireframe at Kensington Roof Gardens (Lord Sugar having a conversation in front of it, unaware that he is actually interacting with the installation)

And a gallery of selected images of all the phases of development and delivery.

[gallery link="file" columns="7"]

Range Rover Evoque interactive installation and microsite

  • Role: Interactive Producer (among other things...)
  • Digital production: The Rumpus Room, London
  • Agency: The Brooklyn Brothers
  • Client: Land Rover
  • Live date: jun 2011

Anonymous functions with PHP / Eclipse

Eclipse is a great IDE, I don't know how could I live without it, but when it comes to PHP development, the PDT plugin shows some flaws unfortunately. It may happen that you need to declare an anonymous function and get a "compiler" error, as shown below:

php fake errors in eclipse pdt

just ignore it, the code is working perfectly well, so declaring an anonymous function will not give any problem, you just need to cope with the little red error message until the end of the project (or declare the callback as an identified function).

Below the code to declare the inner function for array_filter:

foreach( $sem_clusters as $sem_cluster ) {
	$terms = explode(';', preg_replace('/\"/', '', $sem_cluster->terms_meta));
	$terms = array_filter( $terms, function($value) { return strlen($value) > 2; });
	$tf_idf = array_merge( $tf_idf, $terms );
}

Flux of MEME after 6 months: about twitter geo-clustering and topic extraction

It has been quite a while since our first "java -jar fom.jar" and the complexity of the project has constantly grown since the beginning, its tiny team facing every day a new challenge and trying to solve it with the limited amount of available resources. Now it is time to deliver the first prototype, draw a line and define the milestones ahead, but we are reasonably confident that there is room for improvements, and our clustering and topic extraction tool can provide good results. Special thanks go to @fedefrappi who received an email bombarding over the past few months and never lost his temper, great job man!

Flux of MEME - DOW 1st semester from thomas alisi