Custom login/Registration template/page

Hi All

First post to this forum!

I’m trying to create a custom login page for users to my site instead of the normal wordpress login page which doesn’t fit with my design.

I am using the code from http://haveposts.com as inspiration (also works), however I am trying to combine the login and registration onto one page to make it flow more effectively.

I’m having trouble with my code however. Following the instructions from above works perfectly, but i’ve now added both bits of code into one page template and borked it.

Could any of you point me in the right direction for where i’m going wrong? Code below.

<?php
/*
Template Name: Login
*/
?>

<?php get_header(); ?>
<div class="pageheader">
<div class="container">
	<div class="row">
    	<div class="col-md-12">

            <h1><?php the_title(); ?></h1>
        </div>
     </div>
</div>
</div>

<div class="middle-bar">
<div class="container">
	<div class="row">
    	<div class="col-md-5">

        </div>
        <div class="col-md-2">

        </div>
        <div class="col-md-5">

        </div>
    </div>
</div>
</div>

<div class="container">
	<div class="row">
    	<div class="col-md-9">

			<h3>Please login or Register</h3>

            <p>All new registrations are vetted prior to authorisation to ensure you are a valid member of the Afterguard or a Shore-side volunteer.</p>

            <div class="row">
            	<div class="col-md-4">
                	<div class="alert alert-info">
					<h4>Login</h4>
					<?php
            		if($_POST) {

					global $wpdb;

					//We shall SQL escape all inputs
					$username = $wpdb->escape($_REQUEST['username']);
					$password = $wpdb->escape($_REQUEST['password']);
					$remember = $wpdb->escape($_REQUEST['rememberme']);

					if($remember) $remember = "true";
					else $remember = "false";

					$login_data = array();
					$login_data['user_login'] = $username;
					$login_data['user_password'] = $password;
					$login_data['remember'] = $remember;

					$user_verify = wp_signon( $login_data, false ); 

					if ( is_wp_error($user_verify) )
					{
					   header("Location: " . home_url() . "/login/error/");
					   // Note, I have created a page called "Error" that is a child of the login page to handle errors. This can be anything, but it seemed a good way to me to handle errors.
					 } else {
					   echo "<script type='text/javascript'>window.location='". home_url() ."'</script>";
					   exit();
					 }

					} else {

    				// No login details entered - you should probably add some more user feedback here, but this does the bare minimum

					}

					?>

                    <form role="form" id="login" action="<?php echo home_url(); ?>/login/" method="post">
                      <div class="form-group">
                        <label for="username">Username</label>
                        <input id="username" type="text" class="form-control" placeholder="Enter Username">
                      </div>
                      <div class="form-group">
                        <label for="password">Password</label>
                        <input id="password" type="password" class="form-control" placeholder="Password">
                      </div>
                      <button type="submit" class="btn btn-default">Login</button>
                    </form>

                </div>
                </div>

                <div class="col-md-8">
                <div class="panel panel-default">
  <div class="panel-body">
                <h4>Register</h4>
                <?php
require_once(ABSPATH . WPINC . '/registration.php');
global $user_ID;
//Check whether the user is already logged in
if ($user_ID) {

	// They're already logged in, so we bounce them back to the homepage.

	header( 'Location:' . home_url() );

} else {

	$errors = array();

	if( $_SERVER['REQUEST_METHOD'] == 'POST' ) {

		// Check username is present and not already in use
		$username1 = $wpdb->escape($_REQUEST['username2']);
		if ( strpos($username1, ' ') !== false ) {
		    $errors['username2'] = "Sorry, no spaces allowed in usernames";
		}
		if(empty($username1)) {
			$errors['username2'] = "Please enter a username";
		} elseif( username_exists( $username1 ) ) {
			$errors['username2'] = "Username already exists, please try another";
		}

		// Check email address is present and valid
		$email = $wpdb->escape($_REQUEST['email']);
		if( !is_email( $email ) ) {
			$errors['email'] = "Please enter a valid email";
		} elseif( email_exists( $email ) ) {
			$errors['email'] = "This email address is already in use";
		}

		// Check password is valid
		if(0 === preg_match("/.{6,}/", $_POST['password2'])){
		  $errors['password2'] = "Password must be at least six characters";
		}

		// Check password confirmation_matches
		if(0 !== strcmp($_POST['password2'], $_POST['password_confirmation'])){
		  $errors['password_confirmation'] = "Passwords do not match";
		}

		// Check terms of service is agreed to
		if($_POST['terms'] != "Yes"){
			$errors['terms'] = "You must agree to Terms of Service";
		}

		if(0 === count($errors)) {

			$password1 = $_POST['password2'];

			$new_user_id = wp_create_user( $username1, $password1, $email );

			// You could do all manner of other things here like send an email to the user, etc. I leave that to you.

			$success = 1;

			//header( 'Location:' . get_bloginfo('url') . '/login/?success=1&u=' . $username );

		}

	}
}
?>
<form role="form" id="wp_signup_form" action="<?php echo home_url(); ?>/login/" method="post">
  <div class="form-group">
    <label for="username2">Username</label>
    <input type="text" class="form-control" id="username2" placeholder="Enter username">
  </div>
  <div class="form-group">
    <label for="password2">Password</label>
    <input type="password" class="form-control" id="password2" placeholder="Password">
  </div>
  <div class="form-group">
    <label for="password_confirmation">Confirm Password</label>
    <input type="password" class="form-control" id="password_confirmation" placeholder="Password">
  </div>
  <div class="form-group">
    <label for="email">Email address</label>
    <input type="email" class="form-control" id="email" placeholder="Enter email">
  </div>
  <div class="checkbox">
    <label>
      <input type="checkbox" id="terms"> I agree to the Terms of Service
    </label>
  </div>
  <button type="submit" id="submitbtn" class="btn btn-default">Register</button>
</form>

                </div>
                </div>
			</div>
			</div>

		</div>
        <div class="col-md-3 sidebarstyle">
        <img class="logo" src="<?php bloginfo('template_directory'); ?>/assets/img/Logo.png">
           	<?php
              if(is_active_sidebar('sidebar-1')){
              dynamic_sidebar('sidebar-1');
			  }
            ?>
		</div>
	</div>
</div>
<?php get_footer(); ?>