黄聪：自定义WordPress前台、后台顶部菜单栏管理工具条的技巧

最新推荐文章于 2023-01-04 09:59:21 发布
最新推荐文章于 2023-01-04 09:59:21 发布
阅读量292 收藏
点赞数
文章标签： php javascript ViewUI

使用WordPress开发网站项目，很多时候都需要对进行后台定制，今天倡萌主要分享下自定义顶部管理工具条的使用技巧。

 

注：如无特殊说明，请将下面的代码添加到主题的 functions.php  或者插件的函数文件中。

对所有用户和访客隐藏工具条

1
2
3
4

/* 
 * 对所有用户和访客隐藏工具条
 */  
remove_action( 'init', '_wp_admin_bar_init' );

只对管理员显示工具条

1
2
3
4
5
6

/* 
 * 只对管理员显示工具条
 */  
if ( !current_user_can( 'manage_options' ) ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
}

只在后台隐藏工具条

1
2
3
4
5
6

/* 
 * 只在后台隐藏工具条
 */  
if ( is_admin() ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
}

只在前台隐藏工具条

1
2
3
4
5
6

/* 
 * 只在前台隐藏工具条
 */  
if ( !is_admin() ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
}

多站点管理后台隐藏工具条

1
2
3
4
5
6

/* 
 * 对多站点后台隐藏工具条 
 */  
if ( is_network_admin() ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
}

移除工具条占位高度

隐藏工具条以后，顶部可能会残留 28 像素的空白，你可以使用下面的代码删除空白。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

/* 
 * 移除工具条占位空白
 */  
function remove_adminbar_margin() {  
    $remove_adminbar_margin = '<style type="text/css">  
        html { margin-top: -28px !important; }  
        * html body { margin-top: -28px !important; }  
    </style>';  
    echo $remove_adminbar_margin;  
}  
/* 针对后台 */  
if ( is_admin() ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
    add_action( 'admin_head', 'remove_adminbar_margin' );  
}  
/* 针对前台 */  
if ( !is_admin() ) {  
    remove_action( 'init', '_wp_admin_bar_init' );  
    add_action( 'wp_head', 'remove_adminbar_margin' );  
}

移除工具条默认菜单

下面的代码可以移除WordPress顶部工具条的默认项目，请根据自己的需要选择

1
2
3
4
5
6
7
8
9
10
11
12

function wpdaxue_admin_bar() {
    global $wp_admin_bar;
    $wp_admin_bar->remove_menu('wp-logo'); //移除Logo
    $wp_admin_bar->remove_menu('my-account'); //移除个人中心
    $wp_admin_bar->remove_menu('comments'); //移除评论
    $wp_admin_bar->remove_menu('my-sites');  //移除我的网站(多站点)
    $wp_admin_bar->remove_menu('site-name'); //移除网站名称
    $wp_admin_bar->remove_menu('new-content'); // 移除“新建”
    $wp_admin_bar->remove_menu('search');  //移除搜索
    $wp_admin_bar->remove_menu('updates'); //移除升级通知
}
add_action( 'wp_before_admin_bar_render', 'wpdaxue_admin_bar' );

添加一个简单的菜单

添加一个简单的菜单，并且在设置为新窗口打开

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

/* 
 * 添加一个简单的菜单 
 * 自行修改 'title' 和 'href' 的值 
 */  
function custom_adminbar_menu( $meta = TRUE ) {  
    global $wp_admin_bar;  
        if ( !is_user_logged_in() ) { return; }  
        if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( 'Menu Name' ),  
        'href' => 'http://google.com/',  
        'meta'  => array( target => '_blank' ) )  
    );  
}  
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );  
/* add_action # 后面的数字表示位置： 
10 = 在 Logo 的前面 
15 = 在 logo 和 网站名之间 
25 = 在网站名后面 
100 = 在菜单的最后面
*/

添加一个菜单（只显示图标）

上面的例子是添加一个显示文字的链接，如果你只希望显示一个图标，可以使用下面的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

/* 
 * Add Icons Instead of Text to the Main Admin Bar 
 */  
function custom_adminbar_menu( $meta = TRUE ) {  
    global $wp_admin_bar;  
        if ( !is_user_logged_in() ) { return; }  
        if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( '<img src="http://domain.com/wp-content/themes/theme_name/images/wpdaxue-icon.gif" width="25" height="25" />' ),  
        'href' => 'http://www.wpdaxue.com/',  
        'meta'  => array( target => '_blank' ) )  
    );  
}  
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );  
function custom_menu_css() {  
    $custom_menu_css = '<style type="text/css">  
        #wp-admin-bar-custom_menu img { margin:0 0 0 12px; } /** moves icon over */  
        #wp-admin-bar-custom_menu { width:75px; } /** sets width of custom menu */  
    </style>';  
    echo $custom_menu_css;  
}  
 add_action( 'admin_head', 'custom_menu_css' );

注意：第 9 行的 'id' => 'custom_menu' 要和 17、18 行的 #wp-admin-bar-custom_menu  的后半段对应。同时注意修改第 10 行的图片链接。

添加后台管理菜单

通过下面的代码，可以添加任何左边菜单到顶部工具条，支持单站点和多站点模式。这里以“添加 主题编辑 ”为例，更换为其他菜单，请修改里面的 admin_url( 'theme-editor.php' )

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

/* 
 * 添加快捷菜单到 主题编辑 （支持单站点和多站点） 
 */  
function add_theme_menu() {  
    global $wp_admin_bar;  
        if ( !is_user_logged_in() ) { return; }  
        if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }  
    if ( function_exists('is_multisite') && is_multisite() ) {  
        $wp_admin_bar->add_menu( array(  
            'id' => 'theme-editor',  
            'title' => __('Edit Theme'),  
            'href' => network_admin_url( 'theme-editor.php' ) ) 
        );  
    }else{  
        $wp_admin_bar->add_menu( array(  
            'id' => 'theme-editor',  
            'title' => __('Edit Theme'),  
            'href' => admin_url( 'theme-editor.php' ) )  
        );  
    }  
}  
add_action( 'admin_bar_menu', 'add_theme_menu', 100 ); //关于数字 100 ，请查看上一条技巧

添加下拉菜单

添加下拉菜单到工具条，设置为 在新窗口或新标签打开

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

/* 
 * 添加下拉菜单 
 * 修改菜单名、链接名和链接地址 
 */  
function custom_adminbar_menu( $meta = TRUE ) {  
    global $wp_admin_bar;  
        if ( !is_user_logged_in() ) { return; }  
        if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( 'Menu Name' ) )       /* 设置菜单名 */  
    );  
    $wp_admin_bar->add_menu( array(  
        'parent' => 'custom_menu',  
        'id'     => 'custom_links',  
        'title' => __( 'Google'),            /* 设置链接名*/  
        'href' => 'http://google.com/',      /* 设置链接地址 */  
        'meta'  => array( target => '_blank' ) )  
    );  
}  
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );

添加包含多个链接的子菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

/* 
 * 添加包含多个链接的子菜单，在新窗口打开链接 
 * 请修改菜单名和链接地址 
 */  
function custom_adminbar_menu( $meta = TRUE ) {  
    global $wp_admin_bar;  
        if ( !is_user_logged_in() ) { return; }  
        if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( 'Menu Name' ) )           /* 设子菜单名 */  
    );  
    /* sub-menu */  
    $wp_admin_bar->add_menu( array(  
        'parent' => 'custom_menu',  
        'id'     => 'custom_links',  
        'title' => __( 'Sub menu') )         /* 设置子菜单名 */  
    );  
            /* menu links */  
            $wp_admin_bar->add_menu( array(  
                'parent'    => 'custom_links',  
                'title'     => 'Google',             /* 设置链接名 */  
                'href'  => 'http://google.com/', /* 设置链接地址 */  
                'meta'  => array( target => '_blank' ) )  
            );  
            $wp_admin_bar->add_menu( array(  
                'parent'    => 'custom_links',  
                'title'     => 'Yahoo',           /* 设置链接名 */   
                'href'  => 'http://yahoo.com/',  /* 设置链接地址 */ 
                'meta'  => array( target => '_blank' ) )  
            );  
}  
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );

在新窗口打开“访问站点”

默认的情况下，点击”访问网站“这个菜单时，是直接在本窗口打开的，你可以使用下面的代码让它默认在新窗口/标签 打开。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/* 
 * 新窗口打开：我的网站 > 网站名 > 访问网站 
 */  
function my_site_links() {  
    global $wp_admin_bar;  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
        $menu_id  = 'blog-' . $blog->userblog_id;  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-v',  
            'title'     => __( 'Visit Site' ),  
            'href'  => get_home_url( $blog->userblog_id, '/' ),  
            'meta'  => array( target => '_blank' ) )  
        );  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'my_site_links' );

隐藏“我的站点”的子菜单（多站点）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/* 
 * 移除多站点的“我的网站”的子菜单： 仪表盘、新文章、管理评论 和 访问文章 
 */  
function remove_mysites_links () {  
    global $wp_admin_bar;  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
        $menu_id_d  = 'blog-' . $blog->userblog_id . '-d';       /* Dashboard var */  
        $menu_id_n  = 'blog-' . $blog->userblog_id . '-n';       /* New Post var */  
        $menu_id_c  = 'blog-' . $blog->userblog_id . '-c';       /* Manage Comments var */  
        $menu_id_v  = 'blog-' . $blog->userblog_id . '-v';       /* Visit Site var */  
        $wp_admin_bar->remove_menu($menu_id_d);              /* 移除 仪表盘 */  
        $wp_admin_bar->remove_menu($menu_id_n);              /* 移除 发布新文章 */  
        $wp_admin_bar->remove_menu($menu_id_c);              /* 移除 管理评论 */  
        $wp_admin_bar->remove_menu($menu_id_v);              /* 移除 访问网站 */  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'remove_mysites_links' );

添加子菜单到“我的站点”（多站点）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73

/* 
 * 添加子菜单到“我的网站”： Log Out, Media, Links, Pages, Appearance, Plugins, Users, Tools and Settings 
 */  
function add_mysites_link () {  
    global $wp_admin_bar;  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
        $menu_id  = 'blog-' . $blog->userblog_id;  
        /* Add a Log Out Link */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-logout',  
            'title'     => __( 'Log Out' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-login.php?action=logout' ) )  
        );  
        /* Media Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-media',  
            'title'     => __( 'Media Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/upload.php' ) )  
        );  
        /* Links Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-links',  
            'title'     => __( 'Links Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/link-manager.php' ) )  
        );  
        /* Pages Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-pags',  
            'title'     => __( 'Pages Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/edit.php?post_type=page' ) )  
        );  
        /* Appearance Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-appearance',  
            'title'     => __( 'Appearance' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/themes.php' ) )  
        );  
        /* Plugin Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-plugins',  
            'title'     => __( 'Plugin Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/plugins.php' ) )  
        );  
        /* Users Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-users',  
            'title'     => __( 'Users Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/users.php' ) )  
        );  
        /* Tools Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-tools',  
            'title'     => __( 'Tools Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/tools.php' ) )  
        );  
        /* Settings Admin */  
        $wp_admin_bar->add_menu( array(  
            'parent'    => $menu_id,  
            'id'    => $menu_id . '-settings',  
            'title'     => __( 'Settings Admin' ),  
            'href'  => get_home_url( $blog->userblog_id, '/wp-admin/options-general.php' ) )  
        );  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'add_mysites_link' );

使用 Domain.com 作为显示名称（多站点）

默认情况下，多站点的网站名称都是显示“站点名”，如果你要显示为 Domain.com 这样的，可以使用下面的代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

/* 
 * 以域名 to Domain.com 作为菜单名
 */  
function change_site_names() {  
    global $wp_admin_bar;  
        $blue_wp_logo_url = includes_url('images/wpmini-blue.png');  
        $blavatar = '<img src="' . esc_url($blue_wp_logo_url) . '" alt="' . esc_attr__( 'Blavatar' ) . '" width="16" height="16" class="blavatar"/>';  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
            $menu_id  = 'blog-' . $blog->userblog_id;  
            $blogname = ucfirst( $blog->domain );  
        $wp_admin_bar->add_menu( array(  
            'parent'    => 'my-sites-list',  
            'id'    => $menu_id,  
            'title'     => $blavatar . $blogname,  
            'href'  => get_admin_url( $blog->userblog_id ) )  
        );  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'change_site_names' );

移除网站LOGO（多站点）

移除多站点下子站点的logo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/* 
 * Remove the WP Logo from the My Sites Menu 
 */  
function remove_wplogo_mysites() {  
    global $wp_admin_bar;  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
        $menu_id  = 'blog-' . $blog->userblog_id;  
        $blogname = emptyempty( $blog->blogname ) ? $blog->domain : $blog->blogname;  
        $wp_admin_bar->add_menu( array(  
            'parent'    => 'my-sites-list',  
            'id'    => $menu_id,  
            'title'     => $blogname,  
            'href'  => get_admin_url( $blog->userblog_id ) )  
        );  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'remove_wplogo_mysites' );

修改“我的站点”的logo（多站点）

将logo图片上传到 你主题的 images 文件夹，然后根据实际修改第 10 行的 NEW-ICON-HERE.png

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

/* 
 * Change the WP Logo Icon within the My Sites Menu to any icon you want 
 * Update the NEW-ICON-HERE.png name to match the proper file name. 
 */  
function add_mysites_logo() {  
    global $wp_admin_bar;  
    foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {  
        $menu_id  = 'blog-' . $blog->userblog_id;  
        $blogname = emptyempty( $blog->blogname ) ? $blog->domain : $blog->blogname;  
        $blavatar = '<img src="' . get_bloginfo('template_directory') . '/images/NEW-ICON-HERE.png" alt="' . esc_attr__( 'Blavatar' ) . '" width="16" height="16" class="blavatar"/>';  
        $wp_admin_bar->add_menu( array(  
            'parent'    => 'my-sites-list',  
            'id'    => $menu_id,  
            'title'     => $blavatar . $blogname,  
            'href'  => get_admin_url( $blog->userblog_id ) )  
        );  
    }  
}  
add_action( 'wp_before_admin_bar_render', 'add_mysites_logo' );

对访客显示工具条

对没有登录的访客也显示工具条

1
2
3
4

/* 
 * 对没有登录的访客显示工具条 
 */  
add_filter( 'show_admin_bar', '__return_true' );

对已注销的用户创建一个菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14

/* 
 * Create a menu for Logged Out Users 
 */  
function loggedout_menu( $meta = TRUE ) {  
    global $wp_admin_bar;  
        if ( is_user_logged_in() ) { return false; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( 'Menu Name' ),  
        'href' => 'http://google.com/',  
        'meta'  => array( target => '_blank' ) )  
    );  
}  
add_action( 'admin_bar_menu', 'loggedout_menu', 15 );

为已注销的用户添加“登录”链接

1
2
3
4
5
6
7
8
9
10
11
12
13
14

/* 
 * Add a Log In Link for Logged Out Users to the Admin Bar 
 */  
function add_login_link( $meta = FALSE ) {  
    global $wp_admin_bar, $blog_id;  
    if ( is_user_logged_in() ) { return false; }  
    $wp_admin_bar->add_menu( array(  
        'id' => 'custom_menu',  
        'title' => __( 'Login' ),  
        'href' => get_home_url( $blog_id, '/wp-login.php' ) )  
    );  
}  
add_filter( 'show_admin_bar', '__return_true' ); /* turn on adminbar for logged out users */  
add_action( 'admin_bar_menu', 'add_login_link', 15 );

修改工具条的透明度

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

/* 
 * 修改工具条的透明度 
 */  
function adminbar_opacity() {  
    $adminbar_opacity = '<style type="text/css">#wpadminbar { filter:alpha(opacity=50); opacity:0.5; }</style>';  
    echo $adminbar_opacity;  
}  
/* 后台*/  
if ( is_admin() ) {  
    add_action( 'admin_head', 'adminbar_opacity' );  
}  
/* 前台 */  
if ( !is_admin() ) {  
    add_action( 'wp_head', 'adminbar_opacity' );  
}

鼠标悬停时才显示工具条

隐藏工具条，当鼠标悬停在上面时才显示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

/* 
 * 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' );  
}

修改工具条的颜色

下面的例子是将工具条修改为“蓝色”，你可以通过修改颜色的值来改变颜色

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77

/* 
 * Change the Admin Bar Color Scheme 
 */  
function change_adminbar_colors() {  
    $change_adminbar_colors = '<style type="text/css">  
        #wpadminbar *, #wpadminbar{ color:#ffffff;text-shadow:#444444 0 -1px 0; }  
        #wpadminbar{  
            background-color:#003399;  
            background-image:-ms-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-moz-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-o-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-webkit-gradient(linear,left bottom,left top,from(#000033),to(#003399));  
            background-image:-webkit-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:linear-gradient(bottom,#000033,#003399 5px);  
        }  
        /* menu separators */  
        #wpadminbar .quicklinks>ul>li{border-right:1px solid #003399;}  
        #wpadminbar .quicklinks>ul>li>a,#wpadminbar .quicklinks>ul>li>.ab-emptyempty-item{border-right:1px solid #000033;}  
        #wpadminbar .quicklinks .ab-top-secondary>li{border-left:1px solid #000033;}  
        #wpadminbar .quicklinks .ab-top-secondary>li>a,#wpadminbar .quicklinks .ab-top-secondary>li>.ab-emptyempty-item{border-left:1px solid #003399;}  
        /* menu hover color and hover link color */  
        #wpadminbar.nojs .ab-top-menu>li.menupop:hover>.ab-item,#wpadminbar .ab-top-menu>li.menupop.hover>.ab-item{background:#333333;color:#ffffff;}  
        #wpadminbar .hover .ab-label,#wpadminbar.nojq .ab-item:focus .ab-label{color:#ffffff;}  
        #wpadminbar .menupop.hover .ab-label{color:#ffffff;}  
        /* menu, on mouse over hover colors */  
        #wpadminbar .ab-top-menu>li:hover>.ab-item,#wpadminbar .ab-top-menu>li.hover>.ab-item,#wpadminbar .ab-top-menu>li>.ab-item:focus,#wpadminbar.nojq .quicklinks .ab-top-menu>li>.ab-item:focus{  
            color:#fafafa;  
            background-color:#000033;  
            background-image:-ms-linear-gradient(bottom,#003399,#000033);  
            background-image:-moz-linear-gradient(bottom,#003399,#000033);  
            background-image:-o-linear-gradient(bottom,#003399,#000033);  
            background-image:-webkit-gradient(linear,left bottom,left top,from(#003399),to(#003399));  
            background-image:-webkit-linear-gradient(bottom,#003399,#000033);  
            background-image:linear-gradient(bottom,#003399,#000033);  
        }  
        /* menu item links hover color */  
        #wpadminbar .menupop li:hover,#wpadminbar .menupop li.hover,#wpadminbar .quicklinks .menupop .ab-item:focus,#wpadminbar .quicklinks .ab-top-menu .menupop .ab-item:focus{background-color:#ccffcc;}  
        /* menu item non-link colors */  
        #wpadminbar .ab-submenu .ab-item{color:#333333;}  
        /* menu item link colors */  
        #wpadminbar .quicklinks .menupop ul li a,#wpadminbar .quicklinks .menupop ul li a strong,#wpadminbar .quicklinks .menupop.hover ul li a,#wpadminbar.nojs .quicklinks .menupop:hover ul li a{color:#0099cc;}  
        /* my sites hover color */  
        #wpadminbar .quicklinks .menupop .ab-sub-secondary>li:hover,#wpadminbar .quicklinks .menupop .ab-sub-secondary>li.hover,#wpadminbar .quicklinks .menupop .ab-sub-secondary>li .ab-item:focus{background-color:#dfdfdf;}  
        /* update menu colors */  
        #wpadminbar .quicklinks a span#ab-updates{background:#eeeeee;color:#333333;}  
        #wpadminbar .quicklinks a:hover span#ab-updates{background:#ffffff;color:#000000;}  
        /* howdy menu */  
        #wpadminbar .ab-top-secondary{  
            background-color:#003399;  
            background-image:-ms-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-moz-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-o-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:-webkit-gradient(linear,left bottom,left top,from(#000033),to(#003399));  
            background-image:-webkit-linear-gradient(bottom,#000033,#003399 5px);  
            background-image:linear-gradient(bottom,#000033,#003399 5px);  
        }  
        /* Howdy menu, username text color in dropdown */  
        #wpadminbar #wp-admin-bar-user-info .display-name{color:#333333;}  
        #wpadminbar #wp-admin-bar-user-info .username{color:#999999;}  
        /* search */  
        #wpadminbar #adminbarsearch .adminbar-input{color:#ccc;text-shadow:#444 0 -1px 0;background-color:rgba(255,255,255,0);}  
        #wpadminbar #adminbarsearch .adminbar-input:focus{color:#555;text-shadow:0 1px 0 #fff;background-color:rgba(255,255,255,0.9);}  
        #wpadminbar.ie8 #adminbarsearch .adminbar-input{background-color:#003399;}  
        #wpadminbar.ie8 #adminbarsearch .adminbar-input:focus{background-color:#fff;}  
        #wpadminbar #adminbarsearch .adminbar-input::-webkit-input-placeholder{color:#ddd;}  
        #wpadminbar #adminbarsearch .adminbar-input:-moz-placeholder{color:#ddd;}  
    </style>';  
    echo $change_adminbar_colors;  
}  
/* wp-admin area */  
if ( is_admin() ) {  
    add_action( 'admin_head', 'change_adminbar_colors' );  
}  
/* websites */  
if ( !is_admin() ) {  
    add_action( 'wp_head', 'change_adminbar_colors' );  
}

PHP类：只为管理员显示工具条（移除占位高度）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

/* 
 * PHP Class that enables the Admin Bar for Admins Only and Removes 28px Space 
 */  
class admins_only_admin_bar {  
    /* 
     * Loads when class is called 
     */  
    function __construct() {  
        /* disables admin bar */  
        remove_action( 'init', '_wp_admin_bar_init' );  
        /* calls function to remove 28px space */  
        add_action( 'admin_head', array( &$this, 'remove_adminbar_margin' ) );  
        add_action( 'wp_head', array( &$this, 'remove_adminbar_margin' ) );  
    }  
    /* 
     * Removes the 28px margin for the Admin Bar 
     */  
    public function remove_adminbar_margin() {  
        $remove_adminbar_margin = '<style type="text/css">  
            html { margin-top: -28px !important; }  
            * html body { margin-top: -28px !important; }  
        </style>';  
        echo $remove_adminbar_margin;  
    }  
}  
/* Admins Only - Call Class */  
if ( current_user_can( 'manage_options' ) ) {  
    $display_admin_bar = new admins_only_admin_bar();  
}

PHP类：自定义已注销的用户的工具条

为已注销用户（游客）显示工具条、添加登录链接、移除WP Logo、添加自定义菜单

下面的例子，将移除WordPress 的logo、添加一个 登录链接、创建一个包含2个网站名为“Our Other Sites”的下拉菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69

/* 
 * Force Admin Bar for logged out users, add a login link, remove the wp logo, and add a custom link menu 
 */  
class force_admin_bar {  
    /* 
     * Loads when class is called 
     */  
    function __construct() {  
        /* logged out users only */  
        if ( is_user_logged_in() ) { return false; }  
        /* remove wp logo */  
        add_action( 'wp_before_admin_bar_render', array( &$this, 'remove_wp_logo' ) );  
        /* remove search icon [uncomment to activate] */  
        //add_action( 'wp_before_admin_bar_render', array( &$this, 'disable_bar_search' ) );  
        /* force adminbar to logged out users */  
        add_filter( 'show_admin_bar', '__return_true' );  
        /* call function to add login link to admin bar */  
        add_action( 'admin_bar_menu', array( &$this, 'logged_out_menus' ), 15 );  
    }  
    /* 
     * Menus for logged out users 
     */  
    function logged_out_menus( $meta = FALSE ) {  
        global $wp_admin_bar, $blog_id;  
        /* logout menu link */  
        $wp_admin_bar->add_menu( array(  
            'id' => 'login_menu',  
            'title' => __( 'Login' ),  
            'href' => get_home_url( $blog_id, '/wp-login.php' ) )  
        );  
        /* create menus */  
        $wp_admin_bar->add_menu( array(  
            'id' => 'custom_menu',  
            'title' => __( 'Our Other Websites' ) ) /* set the menu name */  
        );  
        /* menu link */  
        $wp_admin_bar->add_menu( array(  
            'parent' => 'custom_menu',  
            'id'     => 'techNerdia', /* unique id name */  
            'title'     => 'techNerdia', /* Set the link title */  
            'href'  => 'http://technerdia.com/', /* Set the link a href */  
            'meta'  => array( target => '_blank' ) )  
        );  
        /* menu link */  
        $wp_admin_bar->add_menu( array(  
            'parent' => 'custom_menu',  
            'id'     => 'Google', /* unique id name */  
            'title'     => 'Google', /* Set the link title */  
            'href'  => 'http://google.com/', /* Set the link a href */  
            'meta'  => array( target => '_blank' ) )  
        );  
    }  
    /* 
    * Remove the WordPress Logo from the WordPress Admin Bar 
    */  
    function remove_wp_logo() {  
        global $wp_admin_bar;  
        $wp_admin_bar->remove_menu('wp-logo');  
    }  
    /* 
    * Disable the Search Icon and Input within the Admin Bar [uncomment to activate] 
    */  
    //function disable_bar_search() {  
    //  global $wp_admin_bar;  
    //  $wp_admin_bar->remove_menu('search');  
    //}  
}  
/* Call Class */  
$force_admin_bar = new force_admin_bar();

将登录链接从左边移动到右边

只针对上面的那个例子

1
2
3
4
5
6
7
8
9
10
11

/* 
 * Move the Login Link from the left side to the right side within the Admin Bar for logged out users. 
 */  
function move_login_link() {  
    $move_login_link = '<style type="text/css">  
        #wpadminbar #wp-admin-bar-login_menu{float:right}  
        }  
    </style>';  
    echo $move_login_link;  
}  
    add_action( 'wp_head', 'move_login_link' );

参考资料：http://technerdia.com/1140_wordpress-admin-bar.html

weixin_33919950
关注
WordPress如何设置文章置顶详细教程,无需插件
weixin_43878963的博客
06-08 1260
WordPress如何设置文章置顶详细教程？无需插件置顶文章，文章置顶是WordPress建站是常用的文章提升重要性的方法。Wordpress设置置顶文章也比较简单，在网站后台就可以设置文章置顶。非常简单，但有些对于wordpress小白不了解的仍然不知道怎么设置置顶文章，下面建站教程网给大家介绍一下WordPress如何设置置顶文章的方法。直接来详细教程。第一种置顶方法： 1、进入你需要置顶的wp网站管理后台。然后点击左侧菜单的文章—所有文章，就可以看到自己网站的所有发布的文章； 2、在每个文章标题的下面
黄聪：WordPress后台添加侧边栏菜单（WP教程add_menu_page）
HandsomeOhJie的博客
07-07 1241
本文是WordPress企业建站系列教程的第三篇文章，需要说明的是，如果想你学习这个企业建站的系列教程，需要你有一点点的WordPress主题或PHP开发基础，没有基础的也可以依样画葫芦，出错了可以给我留言。      在本系列教程的第一篇文章 WordPress后台删除不需要的侧边栏菜单 中，我已经详细介绍了如何删除WordPress后台不必要的菜单，现在我再给大家介绍一下如果往WordPr...
黄聪：自定义WordPress顶部管理工具条的技巧（转）
weixin_33753845的博客
09-18 379
使用WordPress开发网站项目，很多时候都需要对进行后台定制，今天倡萌主要分享下自定义顶部管理工具条的使用技巧。 注：如无特殊说明，请将下面的代码添加到主题的 functions.php  或者插件的函数文件中。 对所有用户和访客隐藏工具条 1 2 3 4 /* * 对所有用户和访客隐藏工具条 */ remove_action( 'i...
wordpress移除/移动/编辑/定制/独显管理员工具AdminBar
weixin_34377065的博客
01-18 268
2019独角兽企业重金招聘Python工程师标准>>> ...
每个人都应该了解的WordPress Admin Bar
cumohuo9136的博客
09-08 373
WordPress comes with an admin bar that displays handy shortcuts for logged in users. This gives you quick access to admin tasks even when viewing your website’s front-end. In this article, we will exp...
mysql field不在列表的排在后面_黄聪：MySQL 按指定字段自定义列表排序
weixin_35422771的博客
01-27 693
问题描述大家都知道, MySQL 中按某字段升序排列的 SQL 为 (以 id 为例, 下同):SELECT * FROM `MyTable`WHERE `id` IN (1, 7, 3, 5)ORDER BY `id` ASC降序排列的 SQL 为:SELECT * FROM `MyTable`WHERE `id` IN (1, 7, 3, 5)ORDER BY `id` DESC有时以上排序并...
wordpress 视频教程+主题+模板
10-16
01 黄聪：2016最新Wordpress主题模版、插件开发教程 (2套) 02 WordPress初级入门（7套） 03 WordPress高级实战（10套） 04 WordPress实战SEO优化（5套） 05 WordPress其他实战教程（6套） 06 WP百科网视频教程全集...
wordpress精仿Ipc.me主题
12-13
在了解这款主题之前，我们需要先知道WordPress是一个开源的内容管理系统（CMS），它允许用户无需编程知识就能创建和管理网站。 一、主题特点 1. 多级下拉菜单：此主题支持多级下拉菜单，这意味着用户可以在主菜单中...
Wordpress文章发表工具(原创+源码)
01-16
自己写的一个wordpress文章winform发表工具，直接操作数据库。需要自己去下载一个MySql.Data.dll 放在Bin目录噢
WordPress后台优化精简：用代码轻松删除WordPress后台不用的功能和菜单
最新发布
程序人生
01-04 1094
WordPress后台优化精简：用代码轻松删除WordPress后台不用的功能和菜单。WordPress不同角色的用户后台所看到侧边栏菜单项都是不一样的。这个时候需求又来了，有些时候即使是管理员，部分菜单也是用不到了，例如用 WordPress 来建一个企业介绍性的网站，该站点根本没有添加评论功能，那么侧边栏的评论菜单是用不着的，如果让企业用户看到，他们会感到很迷惑。所以最好的办法是，根据实际情况，把不该有的侧边栏管理菜单删掉。
WordPress 技巧：移除 Admin Bar 上的 WordPress Logo
sxty0220 博客之家
10-11 868
如何移除 Admin Bar 上的 WordPress Logo，同样是把下面的代码复制到当前主题的 functions.php 文件中： function wpjam_admin_bar_remove() { global $wp_admin_bar; /* Remove their stuff */ $wp_admin_bar->remove_menu('wp-logo
Wordpress 所有 hook 钩子
weixin_45100097的博客
05-27 979
Wordpress 所有 hook 钩子 muplugins_loaded 在必须使用的插件加载之后。 registered_taxonomy 对于类别，post_tag 等 Registered_post_type 用于帖子，页面等 plugins_loaded 加载活动插件和可插拔功能后。 sanitize_comment_cookies 注释cookie被清理后。 setup_theme 加载主题之前。 load_textdomain 对于默认域 after_setup_theme 通常用于初始化主
wordpress 默认小工具修改表
chaoyuan899的专栏
04-24 1762
wordpress 中修改小工具源代码 wordpress 默认小工具修改表 WordPress 默认的边栏小工具代码写在default-widgets.php(wp-includes/default-widgets.php)。此文件中每个类对应一个小工具，如修改 RSS 样式（来自任何 RSS 或 Atom feed 的条目），只要找到 WP_Widget_RSS 这一类修改即可
wordpress 自定义_如何在WordPress中添加自定义仪表板徽标
09-12 210
Do you want to add a custom dashboard logo in WordPress? Often people replace WordPress logo with a custom dashboard logo for branding purposes. In this article, we will show you how to add a custom d...
wordpress优化小技巧之去除顶部工具条
guaishushu1ss的博客
08-11 1124
wordpress为了方便管理员快速的从前台进入后台来管理网站在wordpress顶部强制加入了一个工具条(admin bar)，而且默认是对所有用户都显示的，有时候看着挺烦心。那么怎么来去除这个烦人的工具条(admin bar)呢？下面小V上代码。 一、完全禁用工具条： 1、完全去除wordpress工具条（代码一） 1 show_admin_bar(fals
wordpress 自定义_如何自定义WordPress工具栏
culi3118的博客
08-31 540
wordpress 自定义This article is part of a series created in partnership with SiteGround. Thank you for supporting the partners who make SitePoint possible. 本文是与SiteGround合作创建的系列文章的一部分。 感谢您支持使SitePoint成...
wordpress基础插件开发3-add_action()案例研究
小青蛙的博客
03-16 2171
紧接着wordpress插件开发的学习，真的很枯燥和乏味，但还是要坚持。案例1：在新建文章时，在后台的新建文章页面添加摘要功能：add_action('init','add_post_excerpt_box'); //在页面初始化init（新建） 执行add_post_expert_box方法 function add_post_excerpt_box() { add_post_t...
2016年最新WordPress全方位教程：主题、模板与SEO优化
1. **WordPress基础**：初级入门教程将帮助初学者熟悉WordPress的安装、后台管理、主题切换、插件安装和基本设置，使他们能够快速搭建一个基本的网站。 2. **WordPress主题开发**：黄聪的教程详细讲解了2016年的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值