WordPress is an open source content management tool. It is written in PHP and MySQL. It is used to make beautiful full-fledged websites easily. WordPress can be customized easily by making changes to simple PHP functions. In this tutorials, you will learn simple ways to customize the WordPress admin page by adding a new background, changing the default logo,
Prerequisites
- Domain name (e.g., example.com)
- Text Editor
- WordPress admin credentials
Step 1:
Go to your current theme folder and create a folder and name it admin-login. Inside the folder create a text file and save it as my-custom-css.css
To make sure WordPress access this .css file you need to make some changes to WordPress theme’s function.php file. The function.php can be accessed through the WordPress dashboard inside the Appearance menu
Open the functions.php file and add the following line of code and update the file
function my_custom_admin() {
echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('stylesheet_directory') . '/login/my-custom-css.css" />';
}
add_action('login_head', 'my_custom_admin');This will tell WordPress to look at our custom css when loading the admin login page.
Step 2:
You can replace the default WordPress logo and add your own custom logo by adding some lines of code to our newly created css file.
.login h1 a {
background-image: url('my-login-logo.png');
}You need to make sure your logo file my-logo.png is present in the admin-login folder.
Step 3:
You can also replace the plain background image with your own custom background image. To do so, add another set of codes to your CSS file and save the file.
body.login {
background-image: url('admin-bg.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}Again, you need to make sure the file admin-bg.jpg is inside the admin-login folder.
Step 4:
You can also change the logo link to wordpress.org to your own link. To do that add the following line of codes to your theme’s function.php file.
// Use your own logo link
function wpc_url_login(){
return "http://www.example.com/"; // }
add_filter('login_headerurl', 'wpc_url_login');Conclusion:
By making some changes in the theme’s function.php file and adding your own .css file you can customize the admin login page to your liking.
Check out these top 3 WordPress hosting services:
- Know about the best wordpress web hosting by clicking here.
