Customising WordPress Admin Backend

  1. Add admin.php to inc folder
  2. Add login.css to css folder
  3. Require admin.php in functions.php

1. Add admin.php to inc folder

<?php
/*
This file handles the admin area and functions.
You can use this file to make changes to the
dashboard. Updates to this page are coming soon.
It's turned off by default, but you can call it
via the functions file.

Developed by: Eddie Machado
URL: http://themble.com/pedrev/

Special Thanks for code & inspiration to:
@jackmcconnell - http://www.voltronik.co.uk/
Digging into WP - http://digwp.com/2010/10/customize-wordpress-dashboard/

*/


/************* CUSTOM LOGIN PAGE *****************/

// calling your own login css so you can style it

//Updated to proper 'enqueue' method
//http://codex.wordpress.org/Plugin_API/Action_Reference/login_enqueue_scripts
function custom_login_css() {
wp_enqueue_style( 'custom_login_css', get_stylesheet_directory_uri() . '/css/login.css', false );
}

// changing the logo link from wordpress.org to your site
function custom_login_url() { return home_url(); }

// changing the alt text on the logo to show your site name
function custom_login_title() { return get_option( 'blogname' ); }

// calling it only on the login page
add_action( 'login_enqueue_scripts', 'custom_login_css', 10 );
add_filter( 'login_headerurl', 'custom_login_url' );
add_filter( 'login_headertitle', 'custom_login_title' );


/************* CUSTOMIZE ADMIN *******************/

/*
I don't really recommend editing the admin too much
as things may get funky if WordPress updates. Here
are a few funtions which you can choose to use if
you like.
*/

// Custom Backend Footer
function custom_admin_footer() {
_e( '<span id="footer-thankyou">Developed by <a href="http://samwell.me" target="_blank">Duncan Samwell</a></span>', 'understrap' );
}

// adding it to the admin area
add_filter( 'admin_footer_text', 'custom_admin_footer' );


// Add sidebar (widgets) and Menus editing capabilities to Editor role
$role = get_role('editor'); 
$role->add_cap('edit_theme_options');
?>

2 Create a login.css

/******************************************************************
Site Name:
Author:

Stylesheet: Login Stylesheet

This stylesheet is loaded (if admin.php is setup in your
functions file) on the login page. This way you can style
the login page. It won't affect any other page, admin or front-end.

For more info, check out the codex:
http://codex.wordpress.org/Creating_Admin_Themes

******************************************************************/
/* the form box */
body.login {
background: rgb(113, 0, 33); /* Old browsers */
background: -moz-linear-gradient(
left,
rgba(113, 0, 33, 1) 1%,
rgba(139, 0, 40, 1) 50%,
rgba(113, 0, 33, 1) 100%
); /* FF3.6+ */
background: -webkit-gradient(
linear,
left top,
right top,
color-stop(1%, rgba(113, 0, 33, 1)),
color-stop(50%, rgba(139, 0, 40, 1)),
color-stop(100%, rgba(113, 0, 33, 1))
); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(
left,
rgba(113, 0, 33, 1) 1%,
rgba(139, 0, 40, 1) 50%,
rgba(113, 0, 33, 1) 100%
); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(
left,
rgba(113, 0, 33, 1) 1%,
rgba(139, 0, 40, 1) 50%,
rgba(113, 0, 33, 1) 100%
); /* Opera 11.10+ */
background: -ms-linear-gradient(
left,
rgba(113, 0, 33, 1) 1%,
rgba(139, 0, 40, 1) 50%,
rgba(113, 0, 33, 1) 100%
); /* IE10+ */
background: linear-gradient(
to right,
rgba(113, 0, 33, 1) 1%,
rgba(139, 0, 40, 1) 50%,
rgba(113, 0, 33, 1) 100%
); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#710021', endColorstr='#710021',GradientType=1 ); /* IE6-9 */

/*
This is the WordPress logo in the admin area.
You'll have to load your own images and mess
with the width and height.
*/
/*
You'll have to override some of the default styles
but since we're referencing the id, it should be easy.
*/
/* login button*/
}
body.login h1 a {
background: url(../img/broadland-consultants-logo-trans.png) no-repeat top
center;
/* make sure to replace this! */
width: 310px;
height: 220px;
text-indent: -9999px;
overflow: hidden;
padding-bottom: 0;
display: block;
margin-bottom: 10px;
}
body.login form {
margin-top: 0;
margin-left: 8px;
padding: 26px 24px 46px;
font-weight: normal;
background: #8b0028;
border: 1px solid #8b0028;
color: #8b0028;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
box-shadow: 0 0 15px 3px rgba(0, 0, 0, 0.2);
}
body.login form .input {
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue",
sans-serif;
font-weight: 200;
font-size: 24px;
width: 97%;
padding: 3px;
margin-top: 2px;
margin-right: 6px;
margin-bottom: 16px;
border: 1px solid #8b0028;
background: #fbfbfb;
outline: none;
-webkit-box-shadow: inset 1px 1px 2px rgba(200, 200, 200, 0.2);
-moz-box-shadow: inset 1px 1px 2px rgba(200, 200, 200, 0.2);
box-shadow: inset 1px 1px 2px rgba(200, 200, 200, 0.2);
}

body.login label {
color: #ccc;
}

body.login #nav a,
body.login #backtoblog a {
color: #fff;
}

#login {
padding: 5% 0 0;
}

3 Require admin.php in functions.php

Add the require statement in functions.php

require get_stylesheet_directory() . '/inc/admin.php';