André Amorim

Crafting Web Experiences

//

Custom WordPress login style

PHP Code:

You need to create a login.css but take into consideration the file path!

CSS Code:

body{
	overflow: hidden;
}

.login {
	background: url('../images/login-bg.jpg') center center fixed; //path to a background image
	background-size: cover;
}

/* .login h1::after {
	content: 'Log-In';
	white-space: pre;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
} */

.login #login {
	margin-top: 50px;
    width: 550px;
    padding: 40px;
    background-color: #f7f8f9;
    border-radius: 20px;
	opacity: 0.8;
}

.login #login_error {
	margin-top: 20px;
}

.login form {
	background: none;
	border: none;
	margin-left: 100px;
	margin-right: 100px;
}

.login h1 a {
	height: 40px;
	width: 250px;
	background-size: 180px 64px;
	background-repeat: no-repeat;
	padding-bottom: 30px;
}

Published date:

Modified date: