Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Uses CSS to minify the Wordpress admin bar into a button. Expands on hover.
* Plugin Name: Mini Admin Bar
* Plugin URI:
* Description: Makes the admin bar a small button on the left and expands on hover.
* Version: 1.0
* Author: NetYou
* Author URI:
* License: MIT
* Copyright: NetYou
add_action('get_header', 'my_filter_head');
function my_filter_head() { remove_action('wp_head', '_admin_bar_bump_cb'); }
function my_admin_css() {
if ( is_user_logged_in() ) {
<style type="text/css">
#wpadminbar {
width: 47px;
min-width: 47px;
overflow: hidden;
-webkit-transition: .4s width;
-webkit-transition-delay: 1s;
-moz-transition: .4s width;
-moz-transition-delay: 1s;
-o-transition: .4s width;
-o-transition-delay: 1s;
-ms-transition: .4s width;
-ms-transition-delay: 1s;
transition: .4s width;
transition-delay: 1s;
#wpadminbar:hover {
width: 100%;
overflow: visible;
-webkit-transition-delay: 0;
-moz-transition-delay: 0;
-o-transition-delay: 0;
-ms-transition-delay: 0;
transition-delay: 0;
<?php }
add_action('wp_head', 'my_admin_css');

This comment has been minimized.

Copy link

@ohryan ohryan commented Mar 26, 2013

This is a great idea. But the way it animates in (at least in chrome) could be better.


This comment has been minimized.

Copy link

@gfazioli gfazioli commented Mar 26, 2013

Mmmm... on FireFox no Mac does't work very well... however good idea


This comment has been minimized.

Copy link
Owner Author

@hitautodestruct hitautodestruct commented Apr 7, 2013

Yes, it's more of a proof of concept. This could be much better with some simple javascript.
I might add some just to make it work properly cross browser.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment