Created
March 29, 2012 13:52
-
-
Save franz-josef-kaiser/2237680 to your computer and use it in GitHub Desktop.
Hide the admin bar with the click of a button in the WP admin UI
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* Plugin Name: "Hide Admin Bar"-Button | |
* Plugin URI: http://unserkaiser.com | |
* Description: Easier debugging when the error message is hidden behind the admin bar. | |
* Version: 0.1 | |
* Author: Franz Josef Kaiser | |
* Author URI: http://unserkaiser.com | |
*/ | |
// Prevent loading this file directly - Busted! | |
! defined( 'ABSPATH' ) AND exit; | |
/** | |
* Adds a button to the admin bar to allow collapsing the admin bar | |
* Else some error messages that are output in the html <head> can not be read | |
* | |
* @version 0.3 | |
* | |
* @return void | |
*/ | |
function oxo_admin_bar_extd() | |
{ | |
global $wp_admin_bar; | |
if ( ! is_admin_bar_showing() ) | |
return; | |
// YOU HAVE TO ADJUST THIS TO FIT YOUR THEME | |
$title = '<div style="cursor: pointer; margin-bottom: 0;">⇐<div></div></div>'; | |
is_admin() AND $title = '<div id="collapse-button" class="ab-icon" style="cursor: pointer; margin-bottom: 0;"><div></div></div>'; | |
$wp_admin_bar->add_node( array( | |
'id' => 'collapse' | |
,'title' => $title | |
,'parent' => false | |
,'meta' => array( | |
'title' => 'collapse' | |
) | |
) ); | |
// Add the scripts | |
add_action( 'admin_footer', 'oxo_admin_bar_extd_cb', 9999 ); | |
} | |
add_action( 'admin_bar_menu', 'oxo_admin_bar_extd' ); | |
/** | |
* Callback that builds the needed script for the admin bar button | |
* | |
* @since 0.3 | |
* | |
* @return void | |
*/ | |
function oxo_admin_bar_extd_cb() | |
{ | |
?> | |
<script type="text/javascript"> | |
jQuery( document ).ready( function($) | |
{ | |
clicked = 0; | |
$( '#wp-admin-bar-collapse div' ).click( function() | |
{ | |
if ( 0 == clicked ) { | |
clicked = 1; | |
$( '#wpadminbar' ).animate( { width: 35 }, 0 ); | |
$( '#wpadminbar' ).css( 'min-width', 35 ); | |
$( '#wp-admin-bar-root-default' ).children().not( '#wp-admin-bar-collapse' ).hide(); | |
$( '#wp-admin-bar-top-secondary' ).hide(); | |
} else { | |
clicked = 0; | |
$( '#wpadminbar' ).animate( { width: '100%' }, 0 ); | |
$( '#wpadminbar' ).css( 'min-width', 600 ); | |
$( '#wp-admin-bar-root-default' ).children().not( '#wp-admin-bar-collapse' ).show(); | |
$( '#wp-admin-bar-top-secondary' ).show(); | |
} | |
} ); | |
} ); | |
</script> | |
<?php | |
} |
I added to my theme's functions.php and the back-end worked. On the front-end, I saw the ⇐ but it didn't do anything when clicked. Suggestions? Or email me direct at "tko" [at] "tourkick.com"
@cliffordp Sry, but conversation has to stay here as it's a public gist for a reason: I host my small plugins here for everyone.
I totally understand keeping the info public, but if you needed/wanted my website info, I wouldn't want to post it here - that's all... Obviously, once it's figured out / fixed, your code would be updated for all to enjoy. :)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@cliffordp I adjusted some stuff. Try it now. If it doesn't work, then just take a look at the
// YOU HAVE TO ADJUST THIS TO FIT YOUR THEME
comment. If you find a solution that calls in the button sprite (search the path, incl. as<img
) and include the necessary css, then please leave a comment here, so I can add it. Thanks.