/ 软件 / 1503阅

自动隐藏WordPress顶部管理工具条

WordPress登录后,会在顶部显示一黑色顶部管理工具条(Admin Bar),着实不美观。虽然要隐藏它很容易,只要登陆后台→用户→个人资料→取消在浏览站点时显示工具栏的勾选即可,但一旦想用就不方便了。

找到了一个灵活的办法,可以实现隐藏工具条,当鼠标悬停在上面时才显示。将如下代码复制入function.php即可。

/* 
 * Hide the WordPress Admin Bar with CSS, then display the Admin Bar on hover with CSS and jQuery 
 */  
function hide_adminbar() {  
    $hide_adminbar = '<script type="text/javascript">  
        $(document).ready( function() {  
            $("#wpadminbar").fadeTo( "slow", 0 );  
            $("#wpadminbar").hover(function() {  
                $("#wpadminbar").fadeTo( "slow", 1 );  
            }, function() {  
                $("#wpadminbar").fadeTo( "slow", 0 );  
            });  
        });  
    </script>  
    <style type="text/css">  
        html { margin-top: -28px !important; }  
        * html body { margin-top: -28px !important; }  
        #wpadminbar {  
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
            filter: alpha(opacity=0);  
            -moz-opacity:0;  
            -khtml-opacity:0;  
            opacity:0;  
        }  
        #wpadminbar:hover, #wpadminbar:focus {  
            -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";  
            filter: alpha(opacity=100);  
            -moz-opacity:1;  
            -khtml-opacity:1;  
            opacity:1;  
        }  
    </style>';  
    echo $hide_adminbar;  
}  
/* wp-admin area */  
if ( is_admin() ) {  
    add_action( 'admin_head', 'hide_adminbar' );  
}  
/* websites */  
if ( !is_admin() ) {  
    add_action( 'wp_head', 'hide_adminbar' ); 
}

参考:《25+自定义WordPress顶部管理工具条的技巧》。

# 写于九年前,改于二年前
           

6

  1. Betty

    我的个人资料下,没有取消工具栏这项,只有“在浏览站点时显示工具栏”这一项。
    并且这一选项只在前端有效……
    所以你的取消工具栏这项是哪里来的?

    Google Chrome 47 · Windows 8.1
    1. S̆̈

      @Betty嗯就是这个意思……

      Wordpress App 5 · iPhone iOS 9.2
      1. Betty

        @S̆̈。。。。。。。。

        我还以为你是说在后台也能取消掉这个功能呢……

        “WordPress登录后”这句话太有误导性了,嚓!

        Google Chrome 47 · Windows 8.1
        1. S̆̈

          @Betty后台也可以,用上面的代码。

          Google Chrome 46 · Mac OS X 10.11
          1. Betty

            @S̆̈不想在function.php加太多非必要性的代码,我喜欢轻装上阵。

            另外,强烈建议订阅设置开启全文输出。

            Google Chrome 47 · Mac OS X 10.11
            1. S̆̈

              @Bettyok

              Wordpress App 5 · iPhone iOS 9.2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注