Just upgraded to the beta of 3.2. I like the new admin interface overall. Really, I do. But relatively minor things tend to bug me sometimes.

For example, I don’t much care for the Site Title being so tiny and hidden at the top of the admin screens. I like the site’s name to be big and prominent, as it’s a link to the front end of the site. On multi-site, it’s awfully nice to see at a glance what site I’m on. I often click that link to go to the front end of the site easily. So trying to navigate to the front end became difficult and hit or miss with this title being so tiny.

I also don’t like seeing the Page Title being so big and having a big ol’ icon there beside it. The Page Title strikes me as kinda useless. I mean, I know what screen I’m on.

So I wrote a quick tweak plugin to fix it. I’m posting it in case it bugs you as much as it bugs me. On a side note, it’s a quick little demo of how to modify the WordPress admin CSS quickly and easily.

<?php 
/* 
Plugin Name: Embiggen Site Title for WordPress 3.2 beta
Description: Embiggen the Site Title in wp-admin. Debiggen the Page headers. Ditch the useless icon.
*/
add_action('admin_print_styles', 'big_site_title');
function big_site_title() {
?>
<style>
.wp-admin #wphead {
	height: 42px;
}
.wp-admin #wphead h1 {
	font-size: 28px;
	#font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,sans-serif; #uncomment this if you want to go to the sans-serif font
}
.wp-admin #header-logo {
	background-image: url("images/logo.gif");
	background-size:32px 32px;
	width:32px;
	height:32px;
}
.wp-admin .wrap h2 {
	font-size:16px;
	padding-top: 1px;
	padding-bottom: 0px;
	height:20px;
}
.wp-admin .icon32 {
	display:none;
}
</style>
<?php
}

Feel free to tweak further as desired. Also, WordPress might change further before 3.2 is released, so this may stop working or need further tweaking.

Shortlink:

6 Comments

  1. Nice!

    A couple of additions, to make the other end of the header match the 42px line-height:

    .wp-admin #user_info p {
    line-height: 42px;
    }
    .wp-admin #user_info_arrow {
    top: 7px;
    }

    • Adding that makes the user info pulldown look wrong to me. The text becomes misaligned. Maybe giving it a top margin to push it down might work better, but honestly I think it looks fine as is.

  2. […] published a WordPress 3.2 Beta Admin Tweak tutorial showing how you can improve some of the issues with […]

  3. […] where you are. I think (and others do too, that the site title should be larger than the page name. Otto provided a quick fix to this, which I’ve edited as I still want the page title to be large (though not so large as the site […]

  4. […] Increase size of site title and remove icons (courtesy of Otto) […]

Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Need to post PHP code? Wrap it in [php] and [/php] tags.