Custom WP Login – Full Screen Background

Got tired of using WP Plugins so I decided to knock together a quick theme functions snippet, You'll notice by the sample I've edited the Background, Logo, Submit Button & Links. Just upload your images needed to the images folder within your current themes folder and replace the snippets image urls with yours, Once done paste snippet into your themes functions.php document and hit upload file.

I've also changed the link colours to change these simply find the current colours and tweak to what ever colour you like.

Thank you for reading & Enjoy


//--------------- Login Screen Wallpaper ---------------//			
	
	function login_enqueue_scripts(){
		echo '
			<div class="background-cover"></div>
			<style type="text/css" media="screen">
				.background-cover
					{
						background:url('.get_bloginfo('template_directory').'/images/background) no-repeat center center fixed; 
						-webkit-background-size: cover; 
						-moz-background-size: cover; 
						-o-background-size: cover; 
						background-size: cover; 
						position:fixed; 
						top:0; 
						left:0; 
						z-index:10; 
						overflow: hidden; 
						width: 100%; 
						height:100%;
					} 
				#login
					{
						z-index:9999; 
						position:relative;
					}
				.login form
					{
						-moz-box-shadow: 0px 0px 0px 0px !important;
						-webkit-box-shadow: 0px 0px 0px 0px !important;
						box-shadow: 0px 0px 0px 0px !important;
					}
				.login h1 a
					{
						background:url('.get_bloginfo('template_directory').'/images/logo.png) no-repeat center top !important; 
					} 
				input.button-primary, button.button-primary, a.button-primary
					{
						-moz-border-radius: 3px !important;
						-webkit-border-radius: 3px !important;
						border-radius: 3px !important; 
						-khtml-border-radius: 3px !important;
						background:url('.get_bloginfo('template_directory').'/images/button.jpg); 
						border:none !important;
						font-weight:normal !important;
						text-shadow:none !important;
					}
				.button:active, .submit input:active, .button-secondary:active
					{
						background:#96C800 !important; 
						text-shadow: none !important;
						
					}
				.login #nav a, .login #backtoblog a
					{
						color:#fff !important;
						text-shadow: none !important;
					}
				.login #nav a:hover, .login #backtoblog a:hover
					{
						color:#96C800 !important;
						text-shadow: none !important;
					}
				.login #nav, .login #backtoblog
					{
						text-shadow: none !important;
					}
				</style>
		';
	}
	add_action( 'login_enqueue_scripts', 'login_enqueue_scripts' );